4

使用reactjs发生拖动时如何读取材料表列标题数组？我使用了 onColumnDragged 函数，但只获取了 sourceIndex、destinationIndex 。我需要获取所有列标题顺序以传递给 rest 调用以保存新顺序。

4

2 回答 2

2

有一种灵活的方法可以在拖动时获取材料表的列顺序。

function App() {
  const columns = [...];

  const data = [...];

  function handleColumnDrag() {
    let columnOrder = [];
    columns.forEach(column => {
      columnOrder.push({
        field: column.field,
        columnOrder: column.tableData.columnOrder
      });
    });
    console.log(columnOrder);
  }

  return (
    <div className="App">
      <MaterialTable
        title="Tasks"
        columns={columns}
        data={data}
        onColumnDragged={handleColumnDrag}
      />
    </div>
  );
}

您可能需要根据 API 调用更改columnOrder输出的格式。

演示： Codesandbox 链接

于 2019-10-11T17:18:09.050 回答
0

您可以使用属性获取对表本身的引用，tableRef并且可以在拖动时或在任何时候访问表内部和列信息/数据等。

于 2019-10-10T04:32:13.257 回答