如何使用redux(单击flatlist项)在特定的JSON数组项中更新单个值

Question

我有一个带有名称和状态的套件，我想通过单击flatlist项目单击来切换用户的状态。我为此目的创建了Redux Action和Redux还原器。

itemClick (item,index) {
  const value=false;
  this.props.listItemClick({props:'status',value});
  }

 export default (state = INITIAL_STATE, action) => {
     switch (action.type) {
        case LIST_CLICK:
        console.log(action.payload.props);
            return {...state,[action.payload.props]: action.payload.value};
        default:
            return state;
    }
};

，但无法更改状态对应于指定的用户。例如，raj状态为false

{
"response": [{
  "name": "RAJ",
   "status": true
 }, {
 "name": "RAM",
  "status": true,
}]
}

  <FlatList
     showsVerticalScrollIndicator={false}
     removeClippedSubviews={false}
     data={this.props.response}
     ItemSeparatorComponent = {this.flatListItemSeparator}
     ListFooterComponent={this.flatListItemSeparator}
     keyExtractor={(item, index) => index}
     renderItem={({item,index}) => this.renderFlatListItem(item,index)}/>

Answer 1

我不知道这是否正是您要实现的目标，但我会尝试一下。

//call Action 
this.props.listItemClick('RAJ',false});
//Action
export const listItemClick = (user,status) => {
    return {
        type: LIST_CLICK,
        payload: { user, status }
    };
}; 
 export default (state = INITIAL_STATE, action) => {
     switch (action.type) {
        case LIST_CLICK:
            //replace YOUR_DATA with your state var 
            return {...state, YOUR_DATA: [state.YOUR_DATA.map((val,index) => {
                   if (val.name === action.payload.user) {
                      return { ...val, status: action.payload.status };
                   }
                   return { ...val };
            })]};
        default:
            return state;
    }
};