Question

问题：是否可以在组件中使用redux中的createStore（）？如果是，该如何正确执行？

我试图通过将stopwatch example转换为基于组件的方法来理解反应和还原。

原始方法如下：

let container = Redux.createStore((model = { running: false, time: 0 }, action) => {
  const updates = {
    'START': (model) => Object.assign(model, {running: true}),
    'STOP': (model) => Object.assign(model, {running: false}),
    'TICK': (model) => Object.assign(model, {time: model.time + (model.running ? 1 : 0)})
  };
  return (updates[action.type] || (() => model))(model);
});

和

const render = () => {
  ReactDOM.render(view(container.getState()),
    document.getElementById('root')
  );
};

到目前为止，我得到的是this，它没有显示计数器div。

请注意，我正在尝试理解react和redux背后的原因，从而避免有意使用react-redux。

Answer 1

从技术上讲这是可能的，但这不是您应该这样做的方式。

在React中，您希望render方法的输出仅取决于组件的属性和状态。因此，您要做的是定义一个组件，该组件期望组件外部提供道具，然后使Redux成为该提供者。您可以详细了解here。您的示例还有另一个问题：Redux希望reducer（您传递给createStore的方法）不改变先前的状态。 Object.assign(state, ...)确实使对象变异，因此需要将其更改为Object.assign({}, state, ...)。 here的更多内容。

我为您准备了working snippet，但我强烈建议您遵循官方指南：）

我可以在组件内部的redux中使用createStore（）吗？

1 个答案: