Maison > Article > interface Web > Utilisez vue pour créer une liste déroulante mobile
Utilisez vue pour créer une liste déroulante mobile
- php中世界最好的语言original
- 2018-06-11 10:03:255693parcourir
Cette fois, je vais vous présenter comment utiliser vue pour créer une liste déroulante mobile Quelles sont les précautions à prendre pour utiliser vue pour créer une liste déroulante mobile Voici un cas pratique, jetons un oeil.
Installer
cnpm install vue-droplist --save
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
}
Croyez Après avoir lu le cas dans cet article, vous maîtrisez la méthode. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de PHP !
Lecture recommandée :
Analyse des actifs et des cas d'utilisation statiques
JS utilise createElement() pour ajouter dynamiquement du HTML
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!