Обновите значение массива с помощью старых значений useState

Question

Я уверен, что это простой вопрос, но я не могу понять это.

const [rowLabels, setRowLabels] = React.useState(['','','','','',]);

Я подумал, что это сработает.но ему не нравится синтаксис.

setRowLabels(oldValues => ([
  ...oldValues,
  oldValues[position]: event.target.value
])

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

const rowLabelsCopy = [...rowLabels];
rowLabelsCopy[position] = event.target.value;
setRowLabels(rowLabelsCopy);

Answer 1

Функция setState() принимает обратный вызов, как вы продемонстрировали в своей первой неудачной попытке. Этот обратный вызов может содержать строки во второй попытке и позволить вам использовать oldValues вместо rowLabels:

setRowLabels(oldValues => {
  const newValues = [...oldValues];
  newValues[position] = event.target.value;
  return newValues;
});

Или, если вы не хотите использовать явный возврат, вот немного менее читабельная альтернатива:

setRowLabels(oldValues => Object.assign(
  [...oldValues],
  { [position]: event.target.value }
));