如何在组件中调用json数据

Question

我正在尝试通过组件呈现 json 数据，但我想我错过了一些东西

时间表.json

{

  "items": [

    {

      "id": "1",

      "day": "Cumartesi",

      "events": [

        {

          "key": "1",

          "start": "09:00",

          "end": "09:30",

          "event": "Toplanma ve Kahvaltı"

        },

...

应用程序.js

const [timeTableData, setTimeTableData] = useState([])

  useEffect(() => {

    const fetchData = async () => {

      const tTableResult = await axios('./timetable.json')

      setTimeTableData(tTableResult.data.items[0])

    }

    fetchData()

  }, [])

组件.js

const { items } = props

   const listGroupItems = Object.keys(items.events).map((item) => {

        return (

          <CardBody key={item.key}>

            {item.start}

            {item.end}

            {item.event}

          </CardBody>

        )

    })

我收到“类型错误：无法将未定义或空值转换为对象”

Answer 1

问题出在这一行setTimeTableData(tTableResult.data.items[0])请删除，data因为它未在您提到的 JSON 结构中定义。因此，你可能会得到TypeError: Cannot convert undefined or null to object