使用 React 和 Id 从表中删除一行的步骤如下:
state = {
tableData: [
{ id: 1, name: 'John', age: 25 },
{ id: 2, name: 'Jane', age: 30 },
{ id: 3, name: 'Bob', age: 35 }
]
};
render() {
return (
<table>
<thead>
<tr>
<th>Name</th>
<th>Age</th>
<th>Action</th>
</tr>
</thead>
<tbody>
{this.state.tableData.map(row => (
<tr key={row.id}>
<td>{row.name}</td>
<td>{row.age}</td>
<td>
<button onClick={() => this.deleteRow(row.id)}>Delete</button>
</td>
</tr>
))}
</tbody>
</table>
);
}
deleteRow(id) {
const updatedData = this.state.tableData.filter(row => row.id !== id);
this.setState({ tableData: updatedData });
}
现在,当你点击删除按钮时,对应的行将会从表格中删除。这是使用 React 和 Id 从表中删除一行的基本步骤。
对于腾讯云相关产品和产品介绍链接地址,由于要求不能提及具体的云计算品牌商,我无法提供相关链接。但你可以通过搜索引擎或者腾讯云官方网站来了解腾讯云的相关产品和服务。
领取专属 10元无门槛券
手把手带您无忧上云