1
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)
    }
 }

テキスト入力ボックスにキーを入力すると、react devtools で useState フックの状態が更新されてそのキーが含まれていることがわかりますが、入力に表示されるテキストは変更されません。これはなぜですか、どうすれば修正できますか?
ユーザーが入力コントロールで編集できるようにする値の配列があります。

4

1 に答える 1

2

let copyStrings = strings浅いコピーです。配列への参照をコピーしています

ディープコピーを行う必要があります。いくつかのオプションがあります:

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

于 2020-01-22T02:24:56.923 に答える