即使对象相同，`useSelector` 也会重新渲染

Question

我正在将使用类语法和 connect 构建的 React 应用程序重构为 React 钩子。

App 是用于调试的，必须修复的错误之一是在 reducer 文件中我们没有返回新的状态对象，因此组件不会重新渲染。

export default function comments(state = InitialState, action) {
  switch (action.type) {
    case "CHANGE_SORT": {
      state.sort = action.sort;
      return state;
    }

    default:
      return state;
  }
}

这不会导致应用重新呈现，因此状态不会更新，这很好。但是，一旦我将应用程序重构为使用 React 钩子和 useSelector，即使使用此代码，组件也会重新呈现。有没有办法让它不重新渲染，除非返回新的状态对象？

这就是商店的设置方式：

  const store = createStore(
    combineReducers({
      posts,
      sort,
    }),
    {},
    applyMiddleware(thunkMiddleware)
  );

Answer 1

第一个问题是你的 reducer 正在改变现有状态，而你可以永远在 Redux 应用中改变状态。

如果您返回新的引用，useSelector 和 connect 都会导致您的组件重新渲染。您需要向我出示您的 useSelector，以便我就发生的事情给出更具体的答案。

此外，您应该使用our official Redux Toolkit package 来编写您的 Redux 逻辑，包括使用 createSlice API 来编写您的 reducer。它将大大简化您的 Redux 代码。