无法获取要在NextJS13上呈现的数据

vuktfyat 于 2023-02-19 发布在其他

关注(0)|答案(1)|浏览(166)

我一直在使用next13新的获取方法，但不断收到错误“Error：对象作为React子级无效（找到：[object Promise]）。如果要呈现子级集合，请改用数组。”
我看了其他代码示例，但似乎使用类似的逻辑，我也失去了我所错过的。

async function getData() {
    const res = await fetch('https://jsonplaceholder.typicode.com/todos')
    return res.json()
}

export default async function AccountPage(props) {
    const table = await getData();
  
    return (
      <ul>
        {table.map((todo) => (
          <li key={todo.id}>{todo.title}</li>
        ))}
      </ul>
    );
  }

next.js

来源：https://stackoverflow.com/questions/75489165/can-not-get-data-to-render-on-nextjs13

1条答案

按热度按时间

mu0hgdu01#

当你声明res时，它是一个承诺，当你试图Map表时，它没有被解析。2我将研究一些React的基本原理，比如组件的生命周期和状态。

import React, { useEffect, useState } from "react"

function AccountPage(props) {
  const [table, setTableData] = useState(null)

  const getData = () => {
    fetch('https://jsonplaceholder.typicode.com/todos')
      .then(res => res.json())
      .then(data => {
        setTableData(data)
      })
  }

  useEffect(() => {
    getData()
  }, [])

  return (
    <div>
      {table && <ul>
        {table.map((todo) => (
          <li key={todo.id}>{todo.title}</li>
        ))}
      </ul>}
    </div>

  )
}

export default AccountPage

赞(0）回复(0）举报 2023-02-19

我来回答

无法获取要在NextJS13上呈现的数据

1条答案

相关问题

热门标签

最新问答