Popper.js overlays the input field label

Question

Popper.js overlays material-ui input field if the placement is flipping to the top . How avoid the overlaying?

The popper code:

<Popper
   id={id}
   open={open}
   anchorEl={this.state.anchorEl}
   style={{ zIndex: 13001 }}
   disablePortal={true}
   modifiers={{
     name: 'preventOverflow',
      options: {
        padding: 0,
       },
     }}
 >
  {children elements} 
</Popper>

Answer 1

要解决此问题，请对字段标签使用较大的z-index属性，对Popper元素使用较小的z-index 。