无法从 SWR fetch 访问我的数据 - React

Question

您好，我尝试构建一个从 API 获取数据的应用程序。我使用 SWR Hooks 来获取数据

// libs/fetch.js
import fetch from "isomorphic-unfetch"

export default async function(...args) {
  const res = await fetch(...args)
  return res.json()
}

// App.js
import React, { useEffect } from "react"
import "./styles.css"
import useSWR from "swr"
import fetch from './libs/fetch'

export default function App() {
  const url = "https://data.grandpoitiers.fr/api/records/1.0/search/?dataset=mobilites-stationnement-des-parkings-en-temps-reel&facet=Places_restantes"
  const { data, error } = useSWR(url, fetch)
  return (
    <div className="App">
      {JSON.stringify(data)}
    </div>
  )
}

我无法访问数据值。当我尝试data.records它返回时Cannot read property 'records' of undefined

我不知道该怎么办，我搜索但我没有找到答案。

编辑：https : //codesandbox.io/s/github/MattixNow/PoitiersParker/tree/80871ba94769346a7008312bdb6e4c1143e591a3

有人能帮我吗 ？感谢您的回复

Answer 1

根据文档，您必须处理错误和加载情况

export default function App() {
    const url =
        "https://data.grandpoitiers.fr/api/records/1.0/search/?dataset=mobilites-stationnement-des-parkings-en-temps-reel&facet=Places_restantes"
    const { data, error } = useSWR(url, fetch)

    if (error) return <div>failed to load</div>
    if (!data) return <div>loading...</div>

    return (
        <div className="App">

            {JSON.stringify(data.records)}
        </div>
    )
}