Question

在优化组件性能时，我注意到顺序的shouldComponentUpdate调用似乎缺少我的redux存储中的属性更改。一个例子是：

在道具中：

uiBehavior: {
  shouldShow: false,
}

Redux动作：

fireActionToShow()

Redux Reducer：

case ActionType.UPDATE_UI_BEHAVIOR: return {...state, shouldShow: true}

然后我看到的是

shouldComponentUpdate(nextProps) {
  // Would expect to at some point see:
  this.props.shouldShow === false
  nextProps === true

  // Instead, only seeing
  this.props.shouldShow === false
  nextProps === false

  // then
  this.props.shouldShow === true
  nextProps === true
}

**请注意，这显然不是代码，仅是示例

在我看来，更改道具不会引起重新尝试，还是我错过了什么？

谢谢。

为清楚起见，下面是一些实际代码：

***动作中的事件更新了Redux存储上的uiBehavior道具。

componentDidUpdate(prevProps, prevState) {
    const { uiBehavior } = this.props;

    if (!_.isEqual(uiBehavior.lockAttributes, prevProps.uiBehavior.lockAttributes)) {
      console.log('Lock has changed.'); // This never gets called
    }
}


const mapStateToProps = function(state){
  return {
    uiBehavior: state.uiBehavior,
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(SlotMachine)

***更新

JS调用：

this.props.setGeneralUiKeyValue('lockAttributesInCart', !lockAttributes);

操作：

export const setGeneralUiKeyValue = (key, value) => { return { type: GENERAL_UI_UPDATE, key, value }}

减速器：

export const uiBehavior = (state = {}, action) => {
    let newUiState = {...defaultState, ...state}
    switch (action.type) {
        case uiActionTypes.GENERAL_UI_UPDATE:
            newUiState.general = newUiState.general || {};
            newUiState.general[action.key] = action.value;
            return newUiState
        default:
            return newUiState;
    }
    return newUiState

React Native ShouldComponentUpdate在Redux Props更改之间不触发

0 个答案: