javascript - React js - 如何从 HTML 表中选择所有行 ID
问题描述
我试图通过单击选择包含在 html 表中的所有行 ID 我试图这样做但该功能不起作用并且数组列表显示为空如何做到这一点我可以通过单个复选框选择所有行 ID 我想要所有行idselectedItems
作为列表形式。这是我做的代码。
this.state = {
checkedBoxCheck: false,
selectedItems: [],
stats: [],
}
componentDidMount() {
...
}
toggleSelectAll() {
let selectedItems = [];
if (this.state.selectAll === 0) {
this.state.stats.forEach(x => {
selectedItems[x.id] = true;
});
}
this.setState({
selectedItems: selectedItems,
checkedBoxCheck: true
});
console.log(selectedItems);
}
<thead>
<tr style={{ marginTop: "-88px" }}>
<th class="active" style={{ width: "20px" }}>
<input
type="checkbox"
class="select-all checkbox"
onChange={this.onChange}
name="first_name"
onClick={this.toggleSelectAll.bind(this)}
/>
</th>
<th className="" style={{ width: "20px" }}>
{t("Id")}
</th>
</thead>
<tbody>
{stats.map((c, i) => (
<tr key={c.id}>
<td>
<input
type="checkbox"
id="togBtn"
className="checkbox"
name="selectOptions"
onClick={() => this.onItemSelect(c.id)}
/>
</td>
<td>{c.id}</td>
</tbody>
解决方案
推荐阅读
- flutter - 如何在颤动中修改或更改下拉项的形状?如果可能的话如何创建这样的图像
- javascript - 反应在 URL 中使用名称而不是页面 ID
- objective-c - expo-permissions - 错误:无法识别的权限:位置
- python - 绘制时间序列数据时的值错误
- android - 无法将经过培训的英语、印地语文件从资产文件夹复制到我的移动设备
- python-3.x - TypeError:“Mul”Op 的输入“y”的类型为 float32,与参数“x”的类型 int32 不匹配
- python - 有什么方法可以使用 python 访问 DAYWISE Facebook 广告洞察并将响应数据添加到 mysql 数据库表中?
- sql - 在 SQL 中分隔具有相同属性的表
- authentication - socket.io 验证来自客户端每次发出的令牌
- spring - spring boot websocket代理设置最大连接数