Material-UI: X-Grid / DataGrid 默认 ColumnMenu 不显示

Question

我在我的项目上实现了 x-grid，当点击 3 点时 ColumnMenu 没有显示： popup not displaying when 3-dots are clicked

根据文档，ColumnMenu 的默认行为似乎是出现在单击事件中。

事件被触发，因为我能够在 console.log 中捕获它。这让我想知道是否不满足 x-grid 的依赖关系。但是我有最新版本的 x-grid 和非常新版本的核心包。以下是我的 yarn.lock:

的片段

"@material-ui/x-grid@^4.0.0-alpha.20":
  version "4.0.0-alpha.20"
  dependencies:
    "@material-ui/utils" "^5.0.0-alpha.14"
    "@material-ui/x-license" "^4.0.0-alpha.20"
    prop-types "^15.7.2"
    reselect "^4.0.0"

"@material-ui/core@^4.1.1":
  version "4.11.0"
  dependencies:
    "@babel/runtime" "^7.4.4"
    "@material-ui/styles" "^4.10.0"
    "@material-ui/system" "^4.9.14"
    "@material-ui/types" "^5.1.0"
    "@material-ui/utils" "^4.10.2"
    "@types/react-transition-group" "^4.2.0"
    clsx "^1.0.4"
    hoist-non-react-statics "^3.3.2"
    popper.js "1.16.1-lts"
    prop-types "^15.7.2"
    react-is "^16.8.0"
    react-transition-group "^4.4.0"

我的项目目前是运行 react & react-dom v。 16.13.1，满足@material-ui/core

的最低要求

这是我的 x 网格当前的样子：

         <XGrid
          rows={rows}
          columns={columns}
          rowHeight={38}
          checkboxSelection
          hideFooterSelectedRowCount
          page={page}
          pageSize={rowsPerPage}
          pagination
          paginationMode="server"
          components={{
            Toolbar: () => (
              <XGridToolbar
                title="Titles"
                rowsSelected={selectedRows.length}
                onToolbarDeleteClick={setDeleteDialogOpen}
                onToolbarEditClick={this.handleEditClick}
              />
            ),
          }}
          onSelectionModelChange={this.handleSelectedRows}
          sortingMode="server"
          sortModel={orderBy}
          onSortModelChange={this.handleHeaderClick}
          onPageChange={this.handlePageChange}
          onPageSizeChange={this.handleRowsPerPageChange}
          rowsPerPageOptions={defaultRowsPerPageOptions}
          rowCount={totalCount}
        />

我尝试手动将 components 道具中的 ColumnMenu 设置为默认值 GridColumnMenu 但我没有成功。我也尝试删除我所有的修改并尝试让它与提供的 columns 和 rows 道具一起工作，但这也不起作用。

此外，当我使用默认 Toolbar 时，图标会出现，但是当单击它们时，它们也不会调出面板。

有没有其他人遇到过这种情况？这是一个依赖性问题吗？

提前感谢您的帮助！我一直在到处寻找答案。

Answer 1

它似乎是 https://github.com/mui-org/material-ui-x/issues/946 的副本。但很难说，因为没有提供最小的实时复制。

Answer 2

已解决：问题是 z-index 是从我们的组件继承的。我本来没想去那里看，因为这并没有影响任何其他的弹出窗口或小吃店。

Material-UI: X-Grid / DataGrid 默认 ColumnMenu 不显示

Material-UI: X-Grid / DataGrid Default ColumnMenu Not Showing

reactjs

datagrid

material-ui

mui-datatable