1

使用 create-react-app

//index.js 
...
export const store = createStore(getChange, applyMiddleware(thunk)) 
//getChange is my reducers name

ReactDOM.render(
    <Provider store={store}>
        <App />
    </Provider>, document.getElementById('root'));
registerServiceWorker();


// Box.js which gets rendered in App.js 

import {store} from '../../../index'
...
const renderagain = () => store.getState()

store.subscribe(renderagain)
...

这给我一个错误

TypeError:无法读取未定义的属性“订阅”

打扰一下?我究竟做错了什么?

4

2 回答 2

0
//index.js 
...
export const store = createStore(getChange, applyMiddleware(thunk)) 
//getChange is my reducers name

ReactDOM.render(
    <Provider store={store}>
        <App />
    </Provider>, document.getElementById('root'));
registerServiceWorker();

上面的代码很适合用来创建一个结合了一些减速器的商店。并且还通过将其传递给包装应用程序的提供程序组件来提供整个应用程序。这使得组件可以访问 redux 操作和存储内容。在那里,您可以订阅商店以获取有关商店更改或操作调度的通知。

您正在使用回调以错误的方式订阅。你可以这样使用它:

function select(state) {
  return state.some.deep.property
}
​
let currentValue
function handleChange() {
  let previousValue = currentValue
  currentValue = select(store.getState())
​
  if (previousValue !== currentValue) {
    console.log(
      'Some deep nested property changed from',
      previousValue,
      'to',
      currentValue
    )
  }
}
​
const unsubscribe = store.subscribe(handleChange)
unsubscribe()

有关进一步的文档和查询,您可以查看此内容。https://redux.js.org/api/store#subscribe-listener

于 2018-07-31T20:49:49.823 回答
0

这是一个循环依赖问题。

index.js进口App.js,最终进口Box.js。但是,Box.js正在尝试import {store} from "../../index.js“,这在几个方面是错误的。

您的组件文件应该尝试直接导入商店,并且绝对不应该尝试从index.js. 您也不应该尝试直接在组件文件中订阅商店。

相反,connect()在你的组件中使用 React-Redux 函数来创建包装器,为你管理订阅商店的过程。然后,使用连接的组件,它们会自动使用您传递给的商店<Provider>

于 2018-07-31T21:16:32.487 回答