Question

存在问题，mapDispatchToProps中的状态似乎正在更新，但是即使...，组件也不会重新呈现以反映这些更改。

演示者组件已正确连接到redux动作（在任何情况下都可以通过mapDispatchToProps成功地初始化道具并调用mapDispatchToProps函数）
处理被称为redux动作的redux reducer是不可变地更新状态（使我怀疑这是问题所在（https://github.com/reduxjs/redux/issues/2190#issuecomment-271109542），即。 reducer代码看起来像

const initialState = {
    session: {
        ...
        toUpdate: {success: false, processing: false, message: ''},
        ...
    },
    someOtherStateSections: {...},
    ...
}

const sessionReducer = (state=initialState.session, action) => {
    switch (action.type) {
        ...
        case Types.ACTION_TO_HANDLE:
                console.log(`REDUCER: ACTION_TO_HANDLE: check that state is being updating with intended values:\n${JSON.stringify(action, null, 2)}`)
                return Object.assign({}, state, {toUpdate: {
                    success: action.success,
                    processing: action.processing,
                    message: action.message,
                }})
        ...
    }
}

const rootReducer = combineReducers({
    session: sessionReducer,
    ...
})

export default rootReducer;

从reducer更新后，日志记录语句似乎显示state arg。 mapStateToProps函数中的“正在更新”以反映这些更改。代码段看起来像

const mapStateToProps = (state, ownProps) => {
    console.log(`PickupLocationAnchorFormContainer: mapStateToProps: ${JSON.stringify(state.session.pickupLocationAnchorChangeStatus, null, 2)}`)
    return {
        toUpdate: state.session.toUpdate,
        ownProps: ownProps,
    }
}

const mapDispatchToProps = (dispatch,) => {
  return {
    someThunk: (some, inputs) => {
      dispatch(someThunk(some, inputs))
    },
  }
}

const MyComponentContainer = connect(
  mapStateToProps,
  mapDispatchToProps
)(MyComponent)

export default MyComponentContainer

MyComponent似乎还没有更新其this.props.toUpdate来处理更新后的redux存储值。

并且更新后的状态值与旧值不同（在此示例中，toUpdate.success从false设置为true），使我怀疑问题是否与浅层问题有关。相等性检查（请参阅https://redux.js.org/faq/reactredux#why-isnt-my-component-re-rendering-or-my-mapstatetoprops-running）（尽管到目前为止尚无法解决该错误，所以我知道吗，对吧？）

任何进一步的调试建议或推荐的解决方案将不胜感激。

Answer 1

尝试在reducer中编写此代码：

const sessionReducer = (state=initialState, action) => {
    switch (action.type) {
        ...
        case Types.ACTION_TO_HANDLE:
                return Object.assign({}, state, {
                    ...state,
                    session: {
    ...state.session,
   toUpdate: {
                    success: action.success,
                    processing: action.processing,
                    message: action.message,
                },
           }
       })

    }
}

反应本地redux mapStateToProps状态更新，但不重新呈现presenter组件

1 个答案: