如何用React Hooks更新對象內部數組的特定值？

Question

我有一個我想使用React Hooks更新它的對象

const [rowEdit, setRowEdit] = useState({ rowEdit: { "1x0": [1, 1, 1, 1, 1] } });

我用.map遍歷數組，所以我有每個元素的索引。 如何使第二個值等於0？

Answer 1

如果map索引等於1 ，則可以返回0 ，否則返回當前元素。

例

 const { useState } = React; function App() { const [rowEdit, setRowEdit] = useState({ rowEdit: { "1x0": [1, 1, 1, 1, 1] } }); function onClick() { setRowEdit(prevState => ({ ...prevState, rowEdit: { ...prevState.rowEdit, "1x0": prevState.rowEdit["1x0"].map((row, index) => index === 1 ? 0 : row ) } })); } return ( <div> <button onClick={onClick}>update row</button> <div>{JSON.stringify(rowEdit)}</div> </div> ); } ReactDOM.render(<App />, document.getElementById("root")); 

 <script src="https://unpkg.com/react@16/umd/react.development.js"></script> <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script> <div id="root"></div> 

Answer 2

尚不清楚是否要對對象中的所有鍵執行此操作，但是我將假定您執行此操作：

setRowEdit(rows => Object.entries(rows).reduce((obj, [rowId, row]) => ({
  ...obj,
  [rowId]: row.map((col, i) => i === 1 ? 0 : col),
}), {}));

除此以外：

setRowEdit(rows => ({
  ...rows,
  '1x0': rows['1x0'].map((col, i) => i === 1 ? 0 : col),
}), {}));