Nextjs Получить данные при перезагрузке страницы - PullRequest
Новая
       22

Nextjs Получить данные при перезагрузке страницы

3 голосов
/ 13 октября 2019

В 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? Fetch не запускается в getInitialProps при перезагрузке страницы.

Ответы [ 2 ]

1 голос
/ 14 октября 2019

использовать axios или isomorphic-unfetch. они работают как в клиентской, так и в серверной среде. Fetch API не существует в среде Node.js. Это. Если вы все еще хотите использовать Fetch API в коде на стороне клиента, вам следует использовать isomorphic-unfetch. Когда вы находитесь в браузере, он использует незаполненный polyfill. Если ваш код выполняется в Node.js, он переключается на извлечение узла. 

import "axios" from "axios"
static async getInitialProps(){
const res=await axios.get('url')//
const data=res.data
return {data}
}
1 голос
/ 13 октября 2019

В 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;
...