我正在创建一个表格,我将在其中显示不同的产品,并且我需要选择编辑每个产品。所有这些产品都存储在 redux 存储中,所以我想要做的是按下编辑按钮以在活动存储中显示事件。(我附上一张图片,以便您更好地了解我希望在哪里展示活动)。但我不知道如何捕获数据。
如您所见,当我按下编辑按钮时,我需要的是活动字段显示对象 0 的数据,但我不知道如何捕获数据。
我渲染表格的文件
<div className="mt-5">
<h1>Listado de productos</h1>
<hr/>
<input
type="text"
className="mb-2 form-control"
placeholder="Buscar producto"
/>
<hr />
<button
className="btn btn-primary"
>
Anteriores
</button>
<button
className="btn btn-primary"
>
Siguientes
</button>
<button
className="btn btn-outline-success float-end"
onClick={ handleAgregar }
>
Agregar
</button>
<hr/>
<table className="table table-dark table-striped table-hover table-bordered">
<thead>
<tr>
<th style={{ width: 100 }}>ID</th>
<th style={{ width: 150 }}>Nombre</th>
<th style={{ width: 150 }}>Precio</th>
<th style={{ width: 150 }}>Stock</th>
<th style={{ width: 150 }}>Proveedor</th>
<th style={{ width: 150 }}>Acciones</th>
</tr>
</thead>
<tbody>
{body && body.map( b =>
<tr key={b.id}>
<td>{b.id}</td>
<td>{b.nombre}</td>
<td>{b.precio}</td>
<td>{b.stock}</td>
<td>{b.proveedor.nombre}</td>
<td>
<button className="btn btn-info btn-sm">Editar</button>
<button className="btn btn-danger btn-sm">Eliminar</button>
</td>
</tr>
)}
</tbody>
</table>
我使用 useSelector 从商店获取数据
const { body } = useSelector( state => state.coffe );