如何从 devextreme-reactive 反应网格中的列选择器中删除列？

Question

如何从 devextreme-reactive 反应网格中的列选择器中删除列？请注意，我不想禁用列选择器中的列。

我正在使用以下网格： https://devexpress.github.io/devextreme-reactive/react/grid/docs/guides/column-visibility/

有 columnChooserItem 的文档，但我不知道如何使用它。 https://devexpress.github.io/devextreme-reactive/react/grid/docs/reference/column-chooser/#columnchooseritem

你可以在这里试试代码：https://codesandbox.io/s/f1ogw

import React, { useState } from 'react';
import Paper from '@material-ui/core/Paper';
import {
  Grid,
  Table,
  TableHeaderRow,
  ColumnChooser,
  TableColumnVisibility,
  Toolbar,
} from '@devexpress/dx-react-grid-material-ui';


import { generateRows } from '../../../demo-data/generator';

export default () => {
  const [columns] = useState([
    { name: 'name', title: 'Name' },
    { name: 'gender', title: 'Gender' },
    { name: 'city', title: 'City' },
    { name: 'car', title: 'Car' },
  ]);
  const [rows] = useState(generateRows({ length: 6 }));
  const [defaultHiddenColumnNames] = useState(['gender', 'car']);
  const [tableColumnVisibilityColumnExtensions] = useState([
    { columnName: 'city', togglingEnabled: false },
  ]);

  return (
    <Paper>
      <Grid
        rows={rows}
        columns={columns}
      >
        <Table />
        <TableHeaderRow />
        <TableColumnVisibility
          defaultHiddenColumnNames={defaultHiddenColumnNames}
          columnExtensions={tableColumnVisibilityColumnExtensions}
        />
        <Toolbar />
        <ColumnChooser />
      </Grid>
    </Paper>
  );
};

Answer 1

通过使用showInColumnChooser

对于您不想出现在列选择器中的列，只需将其设置为 false

您可以在demo进行测试

showInColumnChooser={false}/>