复选框在react-bootstrap-table-next中不起作用

问题描述

我正在使用react-bootstrap-table2来制作表格，遇到了一个问题，即

我希望o表格中有一个复选框，因此我正在关注This,mention in the documentation，但结果却出乎意料。

我的代码

用于选择行

const selectRow = {
    mode: 'checkBox',clickToSelect: true,classes: 'selection-row',};

表格呈现

  <BootstrapTable
    keyField="id"
    data={tableData[0].rowsData}
    columns={tableData[0].columnsData}
    selectRow={selectRow}
 />

我认为问题是由于我的数据嵌套了，我正在渲染它，但是我无法解决它。

我的数据

let tableData = [
{
  rowsData: [
    {
      fname: "john",lname: "smith"
    },{
      fname: "steve",lname: "warn"
    },{
      fname: "michel",lname: "clark"
    }
  ],columnsData: [
    {
      datafield: "fname",text: "First name",sort: true
    },{
      datafield: "lname",text: "last Name",sort: true
    }
  ]
}

];

这是我的代码沙箱链接This

解决方法

您正在告诉keyField="id"，但您的每个rowsData都没有id。给他们每个人一个id，它应该可以工作。