javascript - Egghead视频中的React Redux反例

在Dan关于Egghead视频的redux课程上工作时，我遇到一个问题。分派动作时，ReactDOM渲染似乎不起作用。有什么想法吗？
我无法弄清楚到底缺少了什么。

这是代码段的链接：http://jsbin.com/medogul/10/edit?html,js,output

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

const Counter = ({
  value,
  onDecrement,
  onIncrement
}) => (
  <div>
    <h1>{value}</h1>
    <button onClick={onIncrement}> + </button>
    <button onClick={onDecrement}> - </button>
  </div>
);

const { createStore } = Redux;

// specify store with the reducer
const store = createStore(counter);

const render = () => {
  ReactDOM.render(
    <Counter value={store.getState()}
    onIncrement={() => store.dispatch({type:'INCREMENT'})}
    onDecrement={() => store.dispatch({type:'DECREMENT'})}
    />
    document.getElementById('root')
  );
}

store.subscribe(render);
render();

谢谢

最佳答案

您的代码中有2个小问题：


您不应将getState函数传递给组件，而应传递其调用返回的值：<Counter value={store.getState()}
您在React.render函数中省略了逗号：

<Counter value={store.getState()}
         onIncrement={() => store.dispatch({type:'INCREMENT'})}
         onDecrement={() => store.dispatch({type:'DECREMENT'})}
/>, // here must be a comma added
document.getElementById('root')

jsbin上的固定版本

关于javascript - Egghead视频中的React Redux反例，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50348688/