关于将所选用户正确添加到 react native 中的多维数组的两部分问题

Question

我正在尝试弄清楚如何在不同时间将选定的用户添加到多维数组中。我的代码现在的工作方式是，它从 CustomerQue 页面获取选定的用户，并将其添加到"表"页面。然后，使用者添加一个表号，然后点击 set，这会将用户添加到表号中。表就是数组。但是当我返回并尝试添加/选择更多用户以添加到其他表时。它将表和用户全部添加在一起。

这是我来自客户查询的代码...

constructor(props){
super(props);
this.state = {
rlocationcode: '',
dataSource: [],
selectedUsers: [],
};
}

handleTouchItem2 = async (item) => {
try {
let users = this.state.dataSource;
await AsyncStorage.setItem('users', JSON.stringify(users));
this.props.navigation.navigate("Tables", {
cust_ID: item,
otherParam: '101',
});
} catch (error) {
console.log('There is no one checked in', error.message);
}
}

_didSelectUsers = (item) => {
let selectedUsers1 = this.state.selectedUsers;
let isItemSelected = selectedUsers1.filter(item => {
return item.includes(item);
}).length > 20
? true : false;
if (isItemSelected) {
const index = selectedUsers1.findIndex(
obj => obj.item === selectedUsers1
);
selectedUsers1.splice(index, 1);
} else {
selectedUsers1.push(item);
}
this.setState({ selectedUsers1 });
console.log(selectedUsers1)
}

这是我的表页面代码....

constructor(props) {
super(props);
this.array = [],
this.party = [],
this.state = {
arrayHolder: [],
party: [],
disabled: true,
textInput_Holder: '',
selectedIndex: 2,
}
this.updateIndex = this.updateIndex.bind(this)
}
_addTable = (index) => {
if (index === 0) {
this.array.push({Table : this.state.textInput_Holder});
for (var i = 0; i < this.array.length; i++) {
this.setState({ arrayHolder: [...this.array] });
console.log(this.array); 
}
}
}

_setTable2 = async (index) => {
if (index === 1) {
const  { navigation } = this.props;
const cust = navigation.getParam('cust_ID', 'No-User');
const other_param = navigation.getParam('otherParam', 'No-User');
const cust1 = JSON.stringify(cust);
const cust2 = cust1.replace(/[])}[{(]/g, '');
const cust3 = cust2.replace(/[""]/g, '');

try {
await AsyncStorage.setItem('cust3', cust3)
let Tab = [this.array];
let TAC = Tab.concat([cust3]);
this.state.party.push([cust3]);
for (var i = 0; i < this.state.party.length; i++) {
this.setState({ party: [...this.state.party]})
console.log(this.state.party.join('rn'));
return this.state.party.join('rn');
}
} catch(error) {
console.log('There is a problem', error.message);
}
}

}

_openTable = async () => {
try {
const partyGroup = await AsyncStorage.getItem('cust3');
this.props.navigation.navigate('ViewParty', {
TAC1: partyGroup,
otherParam: '101',
});
} catch(error) {
console.log('No Table', error.message)
}
}

我试图从 AsyncStorage 中删除 Item，它删除了所有内容，甚至是我已经添加到数组中的项目。我试图拼接选定的用户，它做同样的事情。它会删除所有内容，当我尝试选择新用户时，它会将我刚刚删除的用户添加回所选用户。

处理此问题的最佳方法是什么？

Answer 1

尝试 react-native hooks。或者，您也可以尝试状态管理(如 redux mobx(来处理整个应用生命周期中的数据。