我正在尝试删除FlatList中的项目,并且所有项目都可以删除,但是只有最后一项保留在列表中而不重新呈现。
我在react-native-collapsible / Accordion中使用FlatList,并尝试通过Redux动作删除项目。当我在slpice之后执行console.log状态数据时,似乎删除了数组中的所有元素,但是即使我通过单击它的相应部分来重新显示“手风琴”列表,数组中的最后一项仍会显示在列表中。
FlatList
<FlatList
data={section.data}
extraData={section.data}
keyExtractor={(item, index) => index.toString()}
renderItem={({ item, index }) => (
<Chore
toDetail={() =>
this.props.navigation.navigate('Details', {
itemId: index,
categoryId: item.categoryId
})}
item={item.desc}
categoryId={item.categoryId}
assignedName= {item.assignedName}
keyExtractor={this._keyExtractor}
index={index}
parentFlatList={this} >
</Chore>
)}
/>
删除函数(src / components / Chore.js)
_handleDelete = () => {
const { dispatch } = this.props;
const deletingCategoryId = this.props.categoryId;
const deletingIndex = this.props.index;
const action = {
type: 'DELETE_CHORE',
deletingCategoryId: deletingCategoryId,
deletingIndex: deletingIndex
}
dispatch(action);
this.setState({activeRowKey: 1})
}
this.setState({activeRowKey:1})是我尝试使其重新呈现该项目但不起作用。
Reducer(src / store / reducers / chores.js)
case DELETE_CHORE:
const {deletingCategoryId, deletingIndex} = action;
newState = state;
newState.choreList[deletingCategoryId].data.splice(deletingIndex, 1);
return newState;
数据结构(src / store / reducers / chores.js)
choreList: [
{
title: "Sunday",
data: [
{
desc: "Laundry",
assignedName: "A",
priority: "High",
note: "Use dry sheet",
categoryId: 0
},
{
desc: "Doing the dishes",
assignedName: "B",
priority: "Medium",
note: "Use pods",
categoryId: 0
}
]
},
当您单击“手风琴”列表的每个部分时,它应该重新渲染列表中的所有元素。