我在我的项目中使用了 react datePicker 和 fixed-data-table-2。当我打开日历时,它显示在桌头后面。这是CSS文件的代码:
.ui-datepicker {
z-index: 9999 !important;
}
.table{
z-index: -1000 !important;
}
这是 DatePicker 的 React 代码:
<div className='ui-datepicker'>
<DatePicker
selected={this.state.startDate}
selectsStart
startDate={this.state.startDate}
endDate={this.state.endDate}
onChange={this.onFilterStart}
/>
</div>
这是表格的快捷代码:
<div className='table'>
<Table
rowHeight={50}
rowsCount={tableData.getSize()}
width={1000}
maxHeight={1800}
height={700}
groupHeaderHeight={30}
headerHeight={50}
onColumnResizeEndCallback={this.resizeEndCallback}
isColumnResizing={false}
>
<ColumnGroup
header={<Cell>Basic Info</Cell>}>
<Column columnKey='menuTranslation'
header={ <SortHeaderCell
languageChosen={this.state.languageChosen}
onSortChange={this.sortChange}
sortDir={colSortDirs.foodName}>Food
Name</SortHeaderCell>}
isResizable={true}
width={columnWidths.foodName}
cell={<MyTextCell data={tableData}
field='menuTranslation' col="menuTranslation" />}
/>
<div>
这是问题的图像: