Quelles instructions sont utilisées pour contrôler l'affichage et le masquage des éléments dans vue ?

Dans vue, vous pouvez contrôler l'affichage et le masquage des éléments via la commande "v-show". Cette commande n'est qu'un simple commutateur basé sur CSS. Vous pouvez contrôler l'affichage et le masquage des éléments en définissant l'attribut de style d'affichage de. l'élément DOM.

L'environnement d'exploitation de ce tutoriel : système Windows 7, vue version 2.9.6, ordinateur DELL G3.

Commande v-show

La commande v-show contrôle l'attribut d'affichage de l'élément pour déterminer s'il doit être affiché. Lorsque la valeur de l'attribut de v-show est vraie, l'élément est affiché, sinon il n'est pas affiché.

v-show Il change l'attribut displayCSS de l'élément en fonction de la valeur vraie ou fausse de l'expression (jugée en fonction de la valeur booléenne dérivée de l'expression)

Utilisation de v-show

1 Déterminer si. un élément est affiché ou masqué

<el-button v-show="list.power == 1" @click="toUpload" class="toUpload" type="primary">去上传<i class="el-icon-upload el-icon--right"></i></el-button>

Passé Si le paramètre list.power dans l'interface est égal à 1, s'il est égal à 1, c'est "vrai", sinon c'est "faux", et puis le v-show La commande est affichée lorsqu'elle est égale à vrai et masquée lorsqu'elle est fausse.

2. Jugement de l'opérateur ternaire

<a class="warn" v-show="true ? item.ai != null : item.ai == null" :href="&#39;http://172.168.80.149:14081/gateway/upload/upload/downloadFile?url=&#39;+item.urlai">AI</a>

En fait, cela peut aussi être abrégé à la première forme

<a class="warn" v-show="!item.ai == null" :href="&#39;http://172.168.80.149:14081/gateway/upload/upload/downloadFile?url=&#39;+item.urlai">AI</a>

C'est plus simple

[Recommandation associée : "tutoriel vue.js"]

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!