无法在nextjs中为useSWR返回使用Array.find

x33g5p2x 于 2023-08-04 发布在其他

关注(0)|答案(3)|浏览(104)

我正在做：

const fetcher = (url: string) => axios.get(url).then((r) => r.data);

const {data} = useSWR("api/data", fetcher, {refreshInterval: 10000})
console.log(data.find(d => d.id === "123"))

字符串
API路由：

const promises = matchString.split(",").map(async (match: string) => {
    try {
      events.push(await Events.find({ name: match }).then((res) => res[0]))
    } catch (error) {
      events.push(error)
      console.log("model/route.js error")
    }
  })
  await Promise.all(promises)
  return new Response(JSON.stringify(events), { status: 200 });

型
然而，错误：

TypeError: Cannot read properties of undefined (reading 'find')

型
我能问一下怎么解决吗？

next.js

来源：https://stackoverflow.com/questions/76726628/fail-to-use-array-find-for-the-useswr-return-in-nextjs

3条答案

按热度按时间

bgibtngc1#

在执行find()方法之前检查数据。

const {data, error} = useSWR("api/data", fetcher, {refreshInterval: 10000});

// check for error
if(error) return <h1>`Something went wrong: ${error}`</h1>

// if data is not available, return
if(!data) return <h1>Loading...</h1>

console.log(data.find(d => d.id === "123"));

字符串

赞(0）回复(0）举报 2023-08-04

pkmbmrz72#

尝试在数组上使用filter()方法
试试这个。。。

const {data} = useSWR("api/data", fetcher, {refreshInterval: 10000})
console.log(data?.filter(d => d.id === "123"));

字符串

赞(0）回复(0）举报 2023-08-04

6yjfywim3#

您需要考虑加载状态。useSWR钩子返回一个isLoading属性，以便在数据加载时显示加载状态。
https://swr.vercel.app/

import useSWR from 'swr'
 
function Profile() {
  const { data, error, isLoading } = useSWR('/api/user', fetcher)
 
  if (error) return <div>failed to load</div>
  if (isLoading) return <div>loading...</div>
  return <div>hello {data.name}!</div>
}

字符串

赞(0）回复(0）举报 2023-08-04

我来回答

无法在nextjs中为useSWR返回使用Array.find

3条答案

相关问题

热门标签

最新问答