TA貢獻1804條經驗 獲得超2個贊
我假設您已經在您的州保存了該數組。然后你可以做這樣的事情：
onClick = (idx) => {
let arr = [...this.state.arrayToModify];
arr.splice(idx,1);
this.setState({ arrayToModify: arr });
}
希望這可以幫助！
TA貢獻1785條經驗 獲得超8個贊
只是改變一個狀態(tài)不會觸發(fā)重新渲染。您需要調用setState()函數：
// class component
onClick = () => {
// update state
this.setState(newState);
}
// functional component
...
const [ state, setState ] = useState();
...
setState(newState);
此外，執(zhí)行不可變狀態(tài)更新非常重要，因為 React 通常依賴于 refs（尤其是在使用memo()或 時PureComponent）。因此，最好使用相同的項目創(chuàng)建新的數組實例。
onClick(obj, index) {
let newData;
if (data.chosenBets[index]) {
newData = data.slice();
newData.chosenBets.splice(index, 1);
} else {
newData = [ obj, ...data ];
}
setState(newData);
}
并且您始終可以使用一些庫進行不可變更新，例如immer、object-path-immutable等。
TA貢獻1773條經驗 獲得超3個贊
在編寫 React 代碼時盡量避免使用不純函數。在這里，拼接是一種不純的方法。我建議使用以下代碼：
onClick(obj, index) {
if (this.state.data.chosenBets[index]) {
// Remove object.
const data = {
...this.state.data,
chosenBets: this.state.data.chosenBets.filter((cBet, i) => i !== index)
};
this.setState({ data });
} else {
// Add object.
const data = {
...this.state.data,
chosenBets: [ ...this.state.data.chosenBets, obj ]
};
this.setState({ data });
}
}
舉報