Redux

Question

编辑：解决方案是将一个不同的变量连接到 mapStateToProps。

我的 react-redux 应用程序遇到了一些问题，我不确定我做错了什么。

Alphabetical 操作和缩减器似乎工作正常，但与 Duplicate 逻辑不同的是，切换字母按钮时词汇表不会重新呈现。我猜这是因为我没有正确地将它连接到商店/发货。

我创建了 Duplicate reducer、action、containers、components，一旦我开始工作，我就将代码复制到 Alphabetical 文件中。除了变量名之外，代码应该是相同的，但是当我运行每个减速器分别在 createStore 中时，duplicates 工作正常而 alphabetical 不是。

您可以通过在 createStore 函数中使用 toggleDuplicates 查看 Alphabetical 按钮的行为方式（我仍在弄清楚为什么组合减速器不起作用 - 也许这与问题？）。

src/entry.jsx

将 allReducers 更改为 toggleDuplicates 或 toggleAlphabetical

let store = createStore(
    allReducers,
    initialState,
    compose(
        applyMiddleware(createLogger())
    )
);

到运行,cd进入目录,然后运行npm install,npm run server

预期的行为是 Duplicate 和 Alphabetize 按钮将在切换时使用正确的值更新 GlossaryTable。 GlossaryTable 应该在更新 visibleWords 状态时重新渲染（在由 toggleDuplicates / toggleAlphabetical reducers 返回之后。

src/containers/GlossaryContainer.js

这是我认为我可能没有正确地将状态连接到调度的地方。

const mapStateToProps = (state) => ({
  visibleWords: getVisibleEntries(
      state.words,
      state.visibleWords,
      state.toggleDuplicates,
      state.toggleAlphabetical
  )
});

const VisibleGlossary = connect(
    mapStateToProps
)(GlossaryTable);

export default VisibleGlossary;

Answer 1

您正在创建一个名为 words 的缩减器，它实际上不是一个缩减器，而是一个数组。

words 应该只是你存储中的数据，而不是 reducer 本身

Redux - 相同的减速器、容器和组件产生不同的结果

Redux - Identical reducers, containers, and components are producing different results

javascript

reactjs

react-redux