javascript - 如何在next.js中重新获取客户端的api数据？

Question

一旦状态改变，我需要从 api 重新加载数据。是否可以在客户端使用 getInitialProps 再次获取数据？

Answer 1

为什么不在componentDidMount上获取数据？

componentDidMount() {
  yourAPI.fetch().then((pFetchData) => {
    this.setState({data: pFetchData});
  });
}

实际上，componentDidMount 是调用获取数据的最佳位置，原因有两个:

1. 使用 DidMount 可以清楚地表明，直到之后才会加载数据初始渲染。这提醒您设置初始状态正确地，这样你就不会导致未定义的状态错误。
2. 如果您需要在服务器上呈现您的应用程序(SSR/同构/其他流行语)，componentWillMount实际上是调用两次“一次在服务器上，一次在客户端”，即可能不是你想要的。将数据加载代码放入componentDidMount 将确保仅从客户。

https://www.codeproject.com/Articles/1177776/Where-to-Fetch-Data-componentWillMount-vs-componen

希望有帮助:)