Nextjs在重新加载页面时获取数据

西里MandyEva2020-03-24

在React中，我们useEffect在重新加载页面时使用来获取数据：

useEffect(() => {
  let ignore = false
  const fetchingData = async () => {
    const res = await fetch(<your_path>)
    const data = await res.json()
    if (!ignore) setData(data)
  }; 
  fetchingData()
  return () => { ignore = true }
}, [])

但是如何在Next.js中执行此操作？getInitialProps重新加载页面时不会触发提取。

小卤蛋前端2020/03/24 17:29:41

在Next.js通常使用HTTP请求加载数据的情况下，getInitialProps您可以将其用作道具：

const App = props => (
  <Layout>
  {props.data}
    ...
  </Layout>
);

App.getInitialProps = async function() {
  const res = await fetch(<your_path>)
  const data = await res.json()
  return {
   data
  }
};

export default App;

Newest Answer

HTML5 Drag & Drop 拖动时更改图标/光标

5 Answer

如何完全卸载 Node.js，然后从头重新安装 (Mac OS X)

NUXT引入tailwindcss报错Error: Expected an opening square bracket.

1 Answer