时间戳

首页 > 解决方案 > 检查是否选择了 MUIDataTable onRowSelect？

reactjs - 检查是否选择了 MUIDataTable onRowSelect？

问题描述

我如何知道是否在 onRowSelect 方法中选择了行？

import MUIDataTable from "mui-datatables";

...

const [ total, setTotal ] = useState(0);

...

const handleRowSelect = (curRowSelected) => {
    console.log(curRowSelected);
    const val = credits[curRowSelected[0].index].amount;
    // I want to add a condition: IF selected, I'll add value to my total variable; otherwise, I'll subtract
}

const options = {
  filterType: 'dropdown',
  pagination: false,
  onRowsSelect: handleRowSelect
};

...

<MUIDataTable
    title={"Payments"}
    data={credits}
    columns={columns}
    options={options}
/>

标签： reactjsmui-datatable

解决方案

在您可以传递的选项中isRowSelectable，将为您提供所选行的索引。

const columns = [....]
const data = [...]
const options = {
...whateverOptionsYouHave,
onRowSelect: (selectedRows) => {

// selectedRows would be an array of objects containing index and dataIndex
/*
  selectRows = [
    { dataIndex: 0, // will be index of selected row
      index: 0
    }
  ]
*/
   console.log(selectedRows)
   // write code to whatever you want to with selected row
 }
}

<MUIDataTable options={options} columns={columns} data={data} />

推荐阅读