3 votes

Comment modifier le z-index de la balise div du menu déroulant Material-UI <Select>?

Je rends une avec une grande valeur de z-index (en utilisant withStyles, elle a une valeur de theme.zIndex.modal + 2 qui se calcule à 1202).

La raison pour cela est de m'assurer que mon composant reste caché derrière la lorsqu'il est ouvert (c'est-à-dire un tiroir découpé).

Cependant, lorsque je rends un composant dans ma appbar, la division de 'dropdown' n'a pas une valeur de z-index suffisamment grande pour être affichée, et donc elle se retrouve cachée derrière la appbar. Un exemple de base est le suivant: let Test = ({classes}) => ( {"Article 1"} {"Article 2"} ) const styles = theme => ({ appbar: { zIndex: theme.zIndex.modal + 2, margin: 0 } }) Test = withStyles(styles)(Test);

Le remplacement du z-index sur l'une des classes exposées de ne semble pas résoudre mon problème. Comment puis-je m'assurer que apparaît devant ?

1voto

h1b9b Points 543

Vous pouvez utiliser l'attribut style sur tous les composants dans Material-UI

   ...

Voir: https://v0.material-ui.com/#/components/select-field
Pour plus de détails sur tous les attributs de style disponibles.

0voto

sai manish Points 1

Vous pouvez utiliser PaperProps sur le composant Drawer pour ajuster le z-index au lieu de modifier le z-index du composant Select.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X