Как обновить с помощью React Hooks конкретное значение массива внутри объекта? - PullRequest
Новая
       11

Как обновить с помощью React Hooks конкретное значение массива внутри объекта?

2 голосов
/ 15 апреля 2019

У меня есть объект, который я хочу обновить, используя React Hooks 

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

Я перебираю массив с помощью .map, поэтому у меня есть индекс для каждого элемента.Как я могу сделать второе значение равным 0?

Ответы [ 2 ]

1 голос
/ 15 апреля 2019

Неясно, хотите ли вы сделать это для всех ключей объекта, но я собираюсь предположить, что вы делаете: 

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),
}), {}));
1 голос
/ 15 апреля 2019

Вы можете вернуть 0, если индекс map равен 1, или вернуть текущий элемент в противном случае.

Пример 

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>
...