我在 JSX 反應組件中獲取數據時遇到問題

Question

我想從 swapi 獲取數據並用這些數據做 jsx 組件，但是當我想使用這些數據時反應給我一個錯誤這是我的獲取

var promise = await fetch('https://swapi.dev/api/people/1/')
  .then((res) =>  res.json() )
  .then(data => setLuke(data.data)) 

這是反應錯誤：

對象作為 React 子級無效（找到：[object Promise]）。 如果您打算渲染一組子項，請改用數組。 我不知道該怎么辦你能幫我解決這個小問題嗎

Answer 1

您可能正在渲染您的 promise var 而不是 {luke}。 另請注意，數據將是 json object，因此您將無法直接渲染它。 您需要先對其進行字符串化。 您當前使用的data.data也將是未定義的。 就用數據吧，它已經包含了json。

await fetch("https://swapi.dev/api/people/1/")
      .then(res => res.json())
      .then(data => {
        setLuke(JSON.stringify(data));
      });

然后您應該能夠使用{luke}渲染它