问题:React Native Flatlist extraData 不工作 redux 数据已更改

我在redux中有数组。我在 Flatlist 上显示数据。但是,当我编辑数组数据时,平面列表不会重新渲染。我怎么解决这个问题?我检查了我的 redux 并且工作正常

            this.props.notes[this.state.Index]={
                color: JSON.stringify(BgColor),
                date: this.state.fullDate.toString(),                    
                note: this.state.noteText,
                name: this.state.noteName,
                type: "note",
                noteID:this.props.notes[this.state.Index].noteID
            }
            this.props.editNotes(this.props.notes);

平面列表代码;

          <FlatList
            ref={(list) => this.myFlatList = list}           
            data={this.props.notes}
            showsVerticalScrollIndicator={false}
            renderItem={({item, index})=>(

            )}
            removeClippedSubviews={true}  
            extraData={this.props.notes}   
           />

与 Flatlist 在同一页面上的 mapStateToProps

const mapStateToProps = (state) => {
    const { notes } = state
    return { notes }
};

减速器

const notes = [];

const notesReducer = (state = notes, action) => {
  switch (action.type) {
    case 'editNotes':
      return state = action.payload;
    default:
      return state
  }
};

export default notesReducer;

解答

它没有正确更新数据的原因是因为突变。

有问题的代码就是这部分。

            this.props.notes[this.state.Index]={
                color: JSON.stringify(BgColor),
                date: this.state.fullDate.toString(),                    
                note: this.state.noteText,
                name: this.state.noteName,
                type: "note",
                noteID:this.props.notes[this.state.Index].noteID
            }
            this.props.editNotes(this.props.notes);

应该是这样的

const { notes, editNotes } = this.props; 
const newNotes = [...notes];
const { index } = this.state;
newNotes[index] = {
  //update data
} 
editNotes(newNotes);
Logo

React社区为您提供最前沿的新闻资讯和知识内容

更多推荐