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

Question

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

我想在我的表中有一个复选框，所以我关注这个，在文档中提到，但我得到了意想不到的结果。

我的代码

用于选择行

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
    }
  ]
}

];

这是我的代码沙箱链接这是

标签： javascriptreactjstwitter-bootstrapreact-bootstrap-table

Answer 1

你说keyField="id"的是你的每个人rowsData都没有id。给他们每个人一个id，它应该工作。