Почему ввод текста реакции не меняется при изменении элемента массива useState? - PullRequest
1 голос
/ 22 января 2020
function Example() {
    const [strings, setStrings] = useState(["hi","yo"]);

    return (
      <div>
         <input name='foo' type="text" value={strings[0]}  onChange={setElement} />
      </div>
    );

    function setElement(e){
        let copyStrings = strings; 
        copyStrings[0] = e.target.value; 
        setStrings(copyStrings)
    }
 }

Когда я набираю клавишу в поле ввода текста, я могу видеть в реагирующих устройствах, что состояние для ловушки useState обновляется и включает эту клавишу, но текст, отображаемый во вводе, не изменяется. Почему это так и как это исправить?
У меня есть массив значений, которые я хочу, чтобы пользователь мог редактировать в элементах управления вводом.

1 Ответ

1 голос
/ 22 января 2020

let copyStrings = strings это мелкая копия. Вы копируете ссылку на массив

, вам нужно сделать глубокую копию. Есть несколько вариантов:

let copyStrings = [...strings]; //works with arrays или let copyStirngs = JSON.parse(JSON.stringify(strings)); // works with objects as well

...