React Native Child Component Не обновляется при изменении состояния redux

Question

У меня есть дочерний компонент, который отображает список элементов в ListView. Данные для ListView берутся из объекта хранилища Redux, прошедшего через родительский mapStateToProps. У дочернего объекта есть кнопки, которые будут удалять элемент при нажатии. Кнопка запускает соответствующие действия диспетчера редукции, и статус обновляется правильно, но дочерний компонент не обновляется. Через точки останова и консольные операторы я проверил, что дочерний компонент componentShouldUpdate и дочерний компонентWillReceiveProps запускаются, когда состояние редукции переходит в состояние chagnes, но метод дочернего рендеринга не срабатывает после изменения состояния.

Родитель

<PendingActionsList 
     proposedStatusChanges={this.props.proposedStatusChanges} 
     certifications={this.props.certifications} 
     driverProfile={this.props.driverProfile} 
     acceptProposedStatusChange={this.props.acceptProposedStatusChange} 
     rejectProposedStatusChange={this.props.rejectProposedStatusChange} 
     navigator={this.props.navigator} 
     /> 

Детского

componentWillMount(){ 
    this.setState({ 
     proposedChanges:this.props.proposedStatusChanges 
    }); 

    } 
    shouldComponentUpdate(nextProps){ 
//fires when expected and returns expected value 
    return nextProps.proposedStatusChanges.length != nextProps.proposedStatusChanges.length; 
    } 
    componentWillReceiveProps(nextProps){ 
    //fires when props change as expected 
    console.log({'will receive props': nextProps}); 
    this.setState({ 
     proposedChanges:nextProps.proposedStatusChanges 
    }); 
    } 

render(){ 
//only fires at intial render 
const dataSource = this.ds.cloneWithRows(this.state.proposedChanges) 
    return(
     <View style={styles.container}> 
     <Text>Pending Actions </Text> 
     <ListView 
      dataSource={dataSource} 
      renderRow={(rowData) => this.renderRow(rowData)} 
      renderSeparator={(sectionId,rowId)=><View key={`${sectionId}-${rowId}`} style={{height:1,backgroundColor:'#D1D1D1'}}/>} 
      /> 
     </View> 
    ); 

Я попытался это без государственных полей тоже, что то, что я ожидал, чтобы работать, но был те же самые результаты.

Answer 1

Это потому, что вы проверяете неравенства в одном объекте все время:

//Replace this: 
return nextProps.proposedStatusChanges.length != nextProps.proposedStatusChanges.length; 
//With this: 
return nextProps.proposedStatusChanges.length != this.props.proposedStatusChanges.length;