redux store.dispatch在嵌套组件中不起作用

Question

我做了实验工作来深度淡化它的复杂性，但它没有起作用。当我点击+按钮时，没有任何反应。为了快速开始并想象我对助手说了什么，我在链接中创建了它：http://plnkr.co/edit/FjnUOZvyN0ft0jxq

const reducer=(state=0,action)=>{
switch(action.type){
case'INCREMENT':return state+1;
case'DECREMENT':return state-1;
default:return state;
}
}
const {createStore}=Redux;
const store = createStore(reducer);
const Counter=()=>{

return(
<div>
<p id='number'>{store.getState()}</p><br/>
<button id='increment' onClick={store.dispatch({type:'INCREMENT'})}>+</button>
<button id='decrement'>-</button>
</div>

)
}

const render=ReactDOM.render(
<React.StrictMode>
<Counter />
</React.StrictMode>,
document.getElementById('root')
);
// Add your code here
store.subscribe(render);
render()

Answer 1

这不是耦合react和redux的方式(您需要使用react redux库、Provider组件以及useDispatch和useSelector挂钩。Never在其中一个组件中直接引用store！(。

或者干脆让react重读一遍。

此外，这是一种非常古老的redux风格，最终会使您编写比所需数量多得多的代码。

我建议你遵循官方的redux教程https://redux.js.org/tutorials/index