Comment gérer les options égarées dans la liste déroulante de sélection d'iview

Cette fois, je vais vous montrer comment gérer le désalignement des options de la liste déroulante de sélection d'iview. Quelles sont les choses auxquelles il faut prêter attention lors de la résolution du désalignement des options de la liste déroulante de sélection d'iview Ce qui suit ? est un cas pratique, jetons un coup d'oeil.

Lors du processus d'utilisation d'iview, j'ai rencontré un tel problème, en utilisant le composant de la liste déroulante de sélection dans

Modèle. Cependant, lorsque la boîte de dialogue dépasse un écran et doit défiler, les options déroulantes sélectionnées seront mal alignées (la figure 1 ci-dessous montre la normale, la figure 2 montre les options déroulantes mal alignées après le défilement.)

Figure 1 :

Figure 2 :

Après analyse du code du composant, le style suivant a été trouvé :

.ivu-modal .ivu-select-dropdown {
  position: absolute !important;
}

Solution

C'est ce style qui affecte le positionnement du La solution est d'écraser le style original de l'auteur.

Cependant, malheureusement, l'auteur a ajouté un !important et a modifié la

priorité.

Alors, comment faire en sorte que votre style ait une priorité plus élevée que le sien ? Vous pouvez ajouter ce style au fichier de style personnalisé :

body .ivu-modal .ivu-select-dropdown{
 position: fixed !important;
}

Cela résout la question problématique mentionnée ci-dessus. Concernant la raison pour laquelle l'ajout d'un corps peut changer la priorité du style, vous pouvez vous référer aux articles liés à mon blog (how2js.cn)

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article pour plus de passionnant. contenu, veuillez faire attention au php chinois Autres articles connexes en ligne !

Lecture recommandée :

Comment jQuery implémente la bascule coulissante gauche et droite

Comment lier la liste déroulante de sélection de vue.js Événements et valeurs

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!