REDUX：通过this.props访问的商店变量已过时，但store.getState（）有效]]

Question

你好！

我遇到了一些问题-我以前从未有过-通过mapStateToProps访问存储变量。也就是说，它们永远不会更改，并且始终以我在商店中设置的默认值进行更改之前。如果我通过store.getState().reducer.x调用它们，则我的代码有效！

[这是我的商店：

export const initialState = {
    isKeyManagementWindowOpen: false
};

const rootReducer = combineReducers({
    some: someReducer,
    settings: settingsComponentReducer
)};

const store = createStore(rootReducer, compose(applyMiddleware(thunk), window.__REDUX_DEVTOOLS_EXTENSION__ ? window.__REDUX_DEVTOOLS_EXTENSION__() : variable => variable));

export default store;

settingsComponentActions.js

export const TOGGLE_KEY_MANAGEMENT_WINDOW = 'TOGGLE_KEY_MANAGEMENT_WINDOW';

export const toggleKeyManagementWindow = isKeyManagementWindowOpen => {
  return { type: TOGGLE_KEY_MANAGEMENT_WINDOW, isKeyManagementWindowOpen};
}
settingsComponentReducer.js

export const settingsComponentReducer = (state = initialState, action) => {
  console.log(action);
  switch (action.type) {
    case Actions.TOGGLE_KEY_MANAGEMENT_WINDOW:
      return Object.assign({}, state, {
        isKeyManagementWindowOpen: action.isKeyManagementWindowOpen
      });
    default: return state;
  }
};
可能引起问题的一件事是我正在用this.props websocket's方法调用subscribe。

Key.js

connectToWebsocket = ip => {
      const stompClient = Stomp.client(`url/receivekey`);
      stompClient.heartbeat.outgoing = 0;
      stompClient.heartbeat.incoming = 0;
      stompClient.debug = () => null;
      stompClient.connect({ name: ip }, frame => this.stompSuccessCallBack(frame, stompClient), err => this.stompFailureCallBack(err, ip));
  }

stompSuccessCallBack = (frame, stompClient) => {
    stompClient.subscribe(KEY_READER_NODE, keyData => {
      if (!this.props.isKeyManagementWindowOpen) {
        this.loginWithKey(keyData.body);
      } else {
        this.addToKeyList(keyData.body);
      }
    });
  }
即使我事先将isKeyManagementWindowOpen设置为true，它仍然解析为false。如果我将!this.props.isKeyManagementWindowOpen与!store.getState().settings.isKeyManagementWindowOpen交换，则代码有效，并且进入this.addToKeyList(keyData.body)。

因此，如果我交换那些，但是将this.addToKeyList中的每个商店调用都保留为this.props.，那么这些都是默认值，这没有意义。仅当我用this.props.交换每条store.getState()...行时，它才有效。

const mapStateToProps = state => ({
    ...
    ...
    isKeyManagementWindowOpen: state.settings.isKeyManagementWindowOpen,
});

export default withRouter(connect(mapStateToProps, mapDispatchToProps)(Key));
截至目前，我的代码有效，但我想将props称为this.props...，而不是通过store.getState()...。知道为什么会发生这种情况吗？

谢谢！

你好！通过mapStateToProps访问存储变量，我遇到了一些以前从未有过的问题。也就是说，它们永远不会改变，并且始终具有我在...

Answer 1

似乎您正在使用深层状态

Answer 2

为什么不使用这样的东西，因为您不应该直接改变应用程序的整体状态，只有在触发了动作的情况下才进行更新，而在更新之前散布原始状态。