使用Wrrasters React组件

Question

将SWR数据获取到我的React组件后，它会崩溃，如果我评论它，它可以正常工作。 遇到以下错误。

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

我会在不计入行const {data} = usewr（`/api/views/$ {slug}`，fetcher）该组件

import { useEffect } from 'react'
import useSWR from 'swr'

const fetcher = (url) => fetch(url).then((r) => r.json())

export default function ViewCounter({
  slug,
  addView = false,
}: {
  slug: string
  addView?: boolean
}) {
  const { data } = useSWR(`/api/views/${slug}`, fetcher)
  // const viewCount = new Number(data?.total)

  useEffect(() => {
    console.log('ViewCounter useEffect', slug, addView)
    const registerView = () =>
      fetch(`/api/views/${slug}`, {
        method: 'POST',
      })

    if (addView) {
      registerView()
    }

  }, [slug])

  // return `${viewCount > 0 ? viewCount.toLocaleString() : '–––'} views`
  return (
    <span className="flex items-center gap-1">
      {data && data?.total}
    </span>
  )
}

可能与此事实有关的事实方面 组件包含在另一个使用Getstatic Paths和GetStaticProps的组件中？

完整的代码库可以在此处找到： https://github.com/sennr-com/sennr-1952135/sennr-1952135/ >

Answer 1

问题似乎是SWR的版本，我必须使用1.1.2或更低，但仍然不知道确切的原因，但它可以起作用。