时间戳

首页 > 解决方案 > ReactJS + Redux 订阅方法一团糟

reactjs - ReactJS + Redux 订阅方法一团糟

问题描述

使用 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：无法读取未定义的属性“订阅”

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

标签： reactjsreduxredux-store

解决方案

//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

推荐阅读