即使 state 已正確更新，UseSelector 也會返回 undefined

Question

我有一個使用 React Redux 的 React 管理項目。

以下是詳細信息：

slice.tsx:

import {createSlice} from "@reduxjs/toolkit";

const newRevisionSlice = createSlice({
    name: 'newRevision',
    initialState: {
      dataList: [],
      status: 'idle'
    },
  reducers: {
    postSaveNewRevision: (state  = { dataList:[], status:"idle" }, action) => {
      return { ...state, dataList: action.payload, status: 'success' };

      }
    }
  });


export const { postSaveNewRevision } = newRevisionSlice.actions;
export default newRevisionSlice.reducer;

component.tsx: 

const newRevision  = useSelector((state: RootState) => state.newRevision)

store.tsx:

declare global {
  interface Window {
    __REDUX_DEVTOOLS_EXTENSION_COMPOSE__?: typeof compose;
  }
}

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

const rootReducer = combineReducers({
  fleetType: fleetTypeApi,
  revisionNo: revisionNoApi,
  revisionDate:revisionDateApi,
  newRevision: newRevisionApi,
});

const store = createStore(rootReducer, composeEnhancers(applyMiddleware(thunk)));

const useAppDispatch = () => store.dispatch;

export type RootState = ReturnType<typeof store.getState>;

export { useAppDispatch };

ReactDOM.render(
  <Provider store={store}>
    <React.StrictMode>
      <App />
    </React.StrictMode>
  </Provider>,
  document.getElementById('root')
);

在 react redux devtool 中，我看到 state 在我發送時已正確更新。 但是，組件中的 useSelector 使 newRevision 返回 undefined。

請你幫助我好嗎？

提前致謝。

Answer 1

您的newRevisionSlice和newRevisionApi中的store.jsx是否有可能是 2 個不同的減速器？ 如果是這種情況，那么您有 2 個單獨的newRevision商店，它們不會共享狀態。

已解決的類似問題：

• useSelector 未使用 Redux 工具包更新
• useSelector state 返回未定義

此外，因為您的useSelector()返回undefined ，所以也可能是切片/縮減器名稱某處存在拼寫錯誤。