@mui/x-data-grid-pro提供的回调函数用于跟踪我所知道的可见列,如下所示:
onColumnVisibilityChange={(params, event, details) => console.log(params, event, details.api.getVisibleColumns()) }
当单个列被切换时触发OK,但是在显示/隐藏所有按钮点击时不触发此事件。对此是否有已知的变通方案?
a8jjtwal1#
问题是onColumnVisibilityChange回调函数只提供单个可见性更改的信息,而不是由显示/隐藏所有列的批量可见性更改触发的。由于@mui/x-data-grid-pro v5.3.0,网格提供了额外的回调函数onColumnVisibilityModelChange:
onColumnVisibilityChange
@mui/x-data-grid-pro v5.3.0
onColumnVisibilityModelChange
onColumnVisibilityModelChange={(params: GridColumnVisibilityModel, event: MuiEvent<{}>, details: GridCallbackDetails) => { console.log(params) }}
params对象包含有关表中所有列的可见性的信息(作为键值对(columnName: boolean))。onColumnVisibilityModelChange回调由单列可见性更改和批量可见性更改触发。通过与columnVisibilityModel datagrid属性配合使用,可以控制网格列的可见性:
params
columnName: boolean
columnVisibilityModel
<DataGrid columnVisibilityModel={columnVisibilityModel} onColumnVisibilityModelChange={newModel => setColumnVisibilityModel(newModel)} />
1条答案
按热度按时间a8jjtwal1#
问题是
onColumnVisibilityChange
回调函数只提供单个可见性更改的信息,而不是由显示/隐藏所有列的批量可见性更改触发的。由于@mui/x-data-grid-pro v5.3.0
,网格提供了额外的回调函数onColumnVisibilityModelChange
:params
对象包含有关表中所有列的可见性的信息(作为键值对(columnName: boolean
))。onColumnVisibilityModelChange
回调由单列可见性更改和批量可见性更改触发。通过与columnVisibilityModel
datagrid属性配合使用,可以控制网格列的可见性: