Maison > interface Web > js tutoriel > Méthode d'implémentation de la liste déroulante Vue

Méthode d'implémentation de la liste déroulante Vue

php中世界最好的语言
Libérer: 2018-05-10 13:37:17
original
5081 Les gens l'ont consulté

Cette fois, je vais vous présenter la méthode d'implémentation de la liste déroulante vueet quelles sont les précautions pour implémenter la liste déroulante vue. Ce qui suit est un cas pratique, jetons un coup d'oeil.

Si vous l'aimez, donnez-lui une étoile. Si vous rencontrez des problèmes, veuillez les signaler

Installer

cnpm install vue-droplist --save
Copier après la connexion
Importer dans le composant

import DropList from 'vue-droplist'
// 显示下拉列表
showDropList() {
// 配置信息
const configData = {
position: { // 设置显示位置
top: '', 
right: '',
bottom: '',
left: ''
},
width: '40%', // 设置宽度
list: [ // 设置下拉列表数据和对应的点击事件
{text: '修改资料', action: this.updateUserInfo},
{text: '更换主题', action: this.updateTheme},
{text: '退出账号', action: this.signOut}
...
],
isShow: true //设置显示,默认false
}
DropList(configData) //执行配置信息
},
updateUserInfo() {
//do something
},
updateTheme() {
//do something
},
signOut() {
//do something
}
Copier après la connexion

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention à. d'autres articles connexes sur le site php chinois !

Lecture recommandée :

Explication détaillée du chargement paresseux de vue-router pour résoudre la lenteur de la première vitesse de chargement


module angulaire2 et module partagé Comment utiliser

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal