单击特定表行时如何向输入显示数据

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 />