Nextjs：每次页面加载时，都会从GET请求中呈现数据

Question

我正在尝试将GET请求中的数据加载到Next.js网站上的表中。当我在本地运行它时，它工作正常，但是当我将其发布到静态站点时，它不会每次都更新表。

我发现当您将数据导出到静态站点时，它会将数据拉入静态HTML页面，但是我希望它每次都将数据拉入表中。如何确保仅使用GET请求中的数据填充数据，而不使用静态HTML页面上的数据填充数据？

我正在使用以下代码执行get请求：

static getInitialProps = async function() {

    var data;
    await axios.get('https://myapi.com')
        .then(res => {
            data = res.data;
        });
    return {
        items: data.TableData
    }

}

我希望它每次都提取数据，但仅在导出时才提取数据，此后不会更改。

Answer 1

如果要在运行时获取数据，可以使用componentDidMount生命周期挂钩并将其置于组件状态。

async componentDidMount() {
  const res = await axios.get('https://myapi.com')
  this.setState({ items: res.data });
}