單擊特定表行時如何向輸入顯示數據

Question

我是 React 的新手，我想知道我該怎么做您可以將該數據添加到表中。

我希望我的問題是有道理的。 謝謝你的每一個回答：）

Answer 1

您執行此操作的方式完全取決於您的表格組件和表單處理。 您是否使用 HTML forms 並使用 state 來管理自己的表單？ 你在使用formik嗎？ 假設您正在使用普通表格組件動態生成表格行，您可以執行以下操作以使每行中的按鈕在單擊時訪問該行中的數據。

const data = [
  { name: 'Joe Shmoe', age: 25 },
  { name: 'Sarah Silverman', age: 40 },
  { name: 'Ronald Lee', age: 10 },
];

const Table = () => {
  return (
    <table>
      <tbody>
        {data.map(d => (
          <tr>
            <td>{d.name}</td>
            <td>{d.age}</td>
            <button onClick={() => alert(d)}>Click me</button>
          </tr>
        ))}
      </tbody>
    </table>
  )
};

Answer 2

如果您可以分享您的代碼，我會更了解您的問題。 根據我的觀察回答你的問題：

制作一個 state 來存儲您選擇的行。 當用戶單擊按鈕時，將此 state 設置為行的數據。

並在輸入的值標簽中使用該 state 。 像這樣：

<input value={state.name} ...other_attributes />