![](/img/trans.png)
[英]How to dynamically disable a row's checkbox in react-bootstrap-table2?
[英]How to add row specific action buttons in react-bootstrap-table2 (React.js)
我正在尝试向使用 react-bootstrap-table2 呈现的表的每一行添加一个删除按钮。 我已经按类别对数据进行了排序,并放置在我的本地 state
state = {
data: [
{
products: [
{
name: "Product 1",
price: "200"
},
{
name: "Product 2",
price: "300"
},
...
]
},
...
}
and rendered a separate table for each object in this.state.data
and filled with the data from the products array from the corresponding object using this.state.data.map((category, index) =>..)
. 我还设置了每个表的id
以匹配this.state.data
的 object 的索引,从它们被渲染的地方。
但我挣扎的是,我想为每一行添加一个删除按钮; 搜索时,我发现了为我们提供cell, row, rowIndex
的columns
的formatter
属性,但我如何访问表的id
? 所以我可以在我的columns
中使用代码:
columns = () => {
...
{
isDummyField: true,
formatter: (cell, row, rowIndex) => {
return <Button
color="primary"
onClick={() => {
console.log (`Product ${rowIndex} of Category ${tableId} deleted`);
}>
Delete Product
</Button>
}
}
}
我不知道如何访问tableId
。 谁能帮我这个? 我一直觉得 react-bootstrap-tables 非常令人困惑。
我从后端解决了这个问题。 基本上我为每个产品添加了一个唯一的 ID,然后在按钮onClick=()
中,我只是使用row.id
访问了产品的唯一 ID
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.