「React Native筆記」在React的 setState 中操作陣列和對象的多種方法（合集）

運用在React 中 setState的對象、陣列的操作時是不能用類似array.push()等方法，因為push沒有返回值，setState後會出現state變成Number，為了方便他人和自己檢視，因此寫個陣列和對象的操作方法小筆記。

• 修改object中某項

this.setState({
  object: {...object, key: value}
});

• 刪除陣列首位

array.splice(0, 1);
this.setState({
  array
});

• 刪除陣列尾部

array.splice(array.length - 1);
this.setState({
  array
});

• 刪除陣列任意一項

array.splice(index, 1);
this.setState({
  array
});

• 陣列尾部添加一項

this.setState({
  array: [...array, item]
});

• 陣列頭部添加一項

this.setState({
  array: [item, ...array]
});

• 陣列任意位置添加一項

array.splice(index, 0, item);
this.setState({
  array
});

• 修改陣列中任意一項中值

function updateArrayItem(index, key, value) {
  this.setState({
    array: array.map((item, _index) => _index == index ? {...item, [key]: value} : item)
  });
}

• 複雜類型修改

this.setState(prevState => return newState);

返回一個新的state對象，可以修改最複雜的state，一般不建議使用