对 axios 检索的数据的无效挂钩调用

Question

我正在尝试从此处检索 JSON 数据，然后在功能组件中更新 state。 尽管代码看起来不错，但我收到一个错误，说它是一个无效的钩子调用。

在反应文档中，它说我可能在同一个文件夹中有 2 个不同的反应应用程序，但是我用他们给出的命令检查了它，只有 1 个。但是我从 django 服务器运行它，并且有一个不同的反应应用程序一个不同的 django 应用程序（所以在一个完全不同的文件夹中）。

const App = () => {
  const [posts, setPosts] = useState([]);

  useEffect(() => {
    let url = "https://jsonplaceholder.typicode.com/posts";
    axios.get(url).then(res => {
      console.log(res.data);
      // The code crashes here saying that it is an invalid hook call
      useState(res.data);
    }).catch(err => console.log(err));
  }, []);

  return (
    <div>
      This is just a place holder.
    </div>
  );
}

我觉得这可能与 django 项目中的其他反应应用程序有关，但如果有人能看到我看不到的东西，我将不胜感激。

编辑我意识到当我应该使用已经在 function 中定义的 setPosts function 时，我试图在 useEffect 挂钩中调用 useState()。

Answer 1

 // The code crashes here saying that it is an invalid hook call

它在那里崩溃，因为您没有正确使用 state 挂钩。 您应该调用setPosts而不是useState 。 请参阅文档。