React - useState 不反映更新的值

Question

我正在嘗試將用戶鍵入的值綁定到另一個輸入中，該輸入是只讀的，但它反映在其他輸入中。 即使我鍵入的值，它也可以出現在 html 上，但我無法將其綁定到其他輸入。 在我發布這個問題之前，我已經搜索了 SO 以綁定值，但其中大多數綁定到 html 而不是其他輸入字段，比如我的情況

這是給我帶來麻煩的代碼codesandbox代碼。

https://codesandbox.io/s/epic-bose-jr8rr

Answer 1

使用 setContactForm 而不是改變 state。

Answer 2

您可以使用當前的 Input 實現來執行此操作。

1. 獲取value作為Input的道具並分配給另一個變量，稱為propValue

function Input({
  ...
  ...
  value: propValue
}) {

2. 如果未提供propValue ，則如下更改 input 的value屬性以回退到本地value （輸入組件中的值）。

<input
     ...
     ...
     value={propValue ?? value}
     ...
     ...
 />

3. 在 App.js 中，將value設置為employeeId為僅准備好的輸入。

<Input
      label="Reflected Id"
      value={employeeId}
      ...
      ...
></Input>