700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > vant 组件中的DropdownMenu 下拉菜单为啥获取不了value值?设置title 值不改变?

vant 组件中的DropdownMenu 下拉菜单为啥获取不了value值?设置title 值不改变?

时间:2021-09-16 15:33:57

相关推荐

vant 组件中的DropdownMenu 下拉菜单为啥获取不了value值?设置title 值不改变?

看到有小伙伴对使用vant框架里DropdownMenu有疑问,统一记录,有默认title

官方地址 https://youzan.github.io/vant/#/zh-CN/dropdown-menu

html

<van-dropdown-menu><van-dropdown-item:title="accountName"v-model="accountNameValue":options="accountNameOptions"@change="toggleAccountName"/><van-dropdown-item:title="licensePlate"v-model="licensePlateValue":options="licensePlateOptions"@change="toggleLicensePlate"/><van-dropdown-item:title="debt"v-model="debtValue":options="debtOptions"@change="toggleDebt"/></van-dropdown-menu>

script

data() {return {accountName: '账户名称',licensePlate: '车牌号',debt: '是否欠款',accountNameValue: '',licensePlateValue: '',debtValue: '',accountNameOptions: [{text: '全部', value: 0 },{text: '测试账户1', value: 1 },{text: '测试账户2', value: 2 },],licensePlateOptions: [{text: '全部', value: 0 },{text: '皖A78956', value: 1 },{text: '皖A75236', value: 2 },],debtOptions: [{text: '不限', value: 0 },{text: '是', value: 1 },{text: '否', value: 2 },],}},methods: {toggleAccountName(value) {this.accountName = this.accountNameOptions[value].textthis.accountNameValue = value},toggleLicensePlate(value) {this.licensePlate = this.licensePlateOptions[value].textthis.licensePlateValue = value},toggleDebt(value) {this.debt = this.debtOptions[value].textthis.debtValue = value}}

成品图

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。