将 Next.js 与 next-redux-wrapper 一起使用时，getInitialProps 似乎不起作用

Question

I'm trying to hook my next.js web app with redux by using 'next-redux-wrapper' HOC.

I was able to fetch data from server from getInitialProps function but after wrapping my _app.js with next-redux-wrapper the getInitialProps functions doesn't seem to work.

What do I do wrong here and how can I fix it?

import React from 'react'
import fetch from 'isomorphic-unfetch'
import { connect } from 'react-redux'
import { getItems } from '../../store/actions/itemAction'

const Index = (props) => {
  console.log(props)

  return ()
}

Index.getInitialProps = async () => {
  let items
  await fetch('http://localhost:5000/item')
    .then(res => res.json())
    .then(data => { items = data })
    .catch(err => console.log(err))

  return { items }
}

const mapStatetoProps = state => ({
  item: state.item,
})

export default connect(mapStatetoProps, null)(Index)

Answer 1

The same problem also exists in the following example provided by zeit / next.js. See https://github.com/zeit/next.js/tree/master/examples/with-redux-wrapper In this example the function "getInitialProps" is not called either. The effect mentioned in the readme, that the time is pre-rendered directly on the server, is therefore not visible.

Answer 2

I think you have to add getInitialProps on what the wrapper HOC withRedux spits out, and call it's original getInitialProps, because it's being used. I didn't figure out how to do it though