8wDlpd.png
8wDFp9.png
8wDEOx.png
8wDMfH.png
8wDKte.png

useQueries 失去了并行查询数据的能力,因为 Next.js 要求服务器组件异步

Abdul Qadeer 3月前

117 0

该应用程序由 Next.js 运行。我有一个 useQueries 钩子:const userQueries = useQueries({ queries: user.contacts.map((contactId: string) => ({ queryKey: ['contact', conta...

该应用程序由 Next.js 运行。

我有一个 useQueries 钩子:

    const userQueries = useQueries({
        queries: user.contacts.map((contactId: string) => ({
            queryKey: ['contact', contactId],
            queryFn: () => getUserById(contactId),
        }))
    });

api.ts 文件中的函数“getUserById”:

export async function getUserById(userId: string) {
    const supabase = createClient();
    let {data} = await supabase
        .from('users')
        .select()
        .eq('id', userId);

    return data && data[0]

}

我发现当我以这种方式加载数据时,它会按顺序加载而不是并行加载。

我尝试将 api 函数设为非异步,以便每个请求不会等待前一个请求,但 Next.js 禁止在没有“async”前缀的情况下执行服务器操作。有办法解决这个问题吗?

帖子版权声明 1、本帖标题:useQueries 失去了并行查询数据的能力,因为 Next.js 要求服务器组件异步
    本站网址:http://xjnalaquan.com/
2、本网站的资源部分来源于网络,如有侵权,请联系站长进行删除处理。
3、会员发帖仅代表会员个人观点,并不代表本站赞同其观点和对其真实性负责。
4、本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
5、站长邮箱:yeweds@126.com 除非注明,本帖由Abdul Qadeer在本站《typescript》版块原创发布, 转载请注明出处!
最新回复 (0)
  • 我在前端团队工作,服务器团队已开始使用不同的方法来处理 API 请求。他们现在要求我发送一个属性,其中包含我希望在

    我在前端团队工作,服务器团队已开始使用不同的方法来处理 API 请求。他们现在要求我发送一个属性,其中包含我希望在响应中返回的特定字段。

    例如:

    http.post(`/api/v1/users`, { requiredFields: [1, 2, 3] }) 
    // The response will be [{ firstname, lastname, age }]
    // This means that firstname is 1, lastname is 2, and so on.
    

    我想根据我发送的数字确保响应类型安全。

    这是一个模拟我需要发送的内容和我收到的内容的小函数:

    function server(fields) {
      const allFields = {
        1: 'firstname',
        2: 'lastname',
        3: 'age',
        4: 'address',
        5: 'email'
      };
    
      const result = {};
    
      fields.forEach(field => {
        if (allFields[field]) {
          result[allFields[field]] = null;
        }
      });
    
      return result;
    }
    

    我想过创建一个接口、类型、枚举或某种模式,但我不确定如何将其集成到 JavaScript 中。

返回
作者最近主题: