(1)组件解释:
本组件是为了解决二级联动的效果编写的,这里使用了省份和城市分开的效果,具体展示效果,可以参考下面。
(2)组件代码:
(3)展示效果:
还可以结合筛选功能使用:
补充知识:vant二级联动picker选择器
我就废话不多说了,大家还是直接看代码吧~
const citys = { '浙江': ['杭州', '宁波', '温州', '嘉兴', '湖州'], '福建': ['福州', '厦门', '莆田', '三明', '泉州'] };
data:{ columns: [ { values: Object.keys(citys), className: 'column1' }, { values: citys['浙江'], className: 'column2', defaultIndex: 2 } ], }
onChange(picker, values) { picker.setColumnValues(1, citys[values[0]]); console.log(values) },
以上这篇vant自定义二级菜单操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。