Как установить значения состояния реакции из других значений состояния?

Question

У меня есть массив объектов в состоянии:

const [formFields, setFormFields] = useState([
{
  height: 45,
  label: "tv",
  placeholder: "555",
  name: "tv",
  maxWidth: 203,
  value: dataValues.tv,
  priority: 1
},
{
  height: 45,
  label: "radio",
  placeholder: "50%",
  name: "radio",
  maxWidth: 126,
  value: dataValues.radio,
  priority: 2
},
{
  height: 45,
  label: "instagram",
  placeholder: "60%",
  name: "instagram",
  maxWidth: 126,
  value: dataValues.instagram,
  priority: 3
}
]);

Мне нужно обновить каждое значение состояния при обновлении другого состояния (когда я нажимаю кнопку отправить деньги каждое значение состояния следует обновить), но это не обновление. Вы можете проверить демо

любую помощь, пожалуйста?

Answer 1

Ваши входные элементы имеют свои значения, установленные на основе вашего formFields объекта. Когда вы изначально создаете объект, вы используете значения из вашего dataValues объекта, и dataValues будет автоматически обновляться на основе вашего apiData объекта из-за того, что вы написали в своем useEffect хуке, однако вы никогда ничего не писали в само обновление formFields.

Следующий код должен заставить его работать как есть,

    const newFormFields = [...formFields];
    newFormFields[0].value = apiData.tv;
    newFormFields[1].value = apiData.radio;
    newFormFields[2].value = apiData.instagram;
    setFormFields(newFormFields);

Однако я бы настоятельно рекомендовал рефакторинг. Похоже, у вас здесь много ненужной избыточности.

Вы упомянули в комментарии, что не можете использовать индексы. В этом случае что-то вроде этого должно работать.

    const newFormFields = [...formFields];
    newFormFields.map(field => (field.value = apiData[field.name]));
    setFormFields(newFormFields);