{site_name}

{site_name}

🌜 搜索

Vant3 Picker 选择器是一种基于 Vue.js 框架的移动端组件,用于在列表中选择一个或多个值

前端 𝄐 0
vant picker多选,vant选项卡,vant checkboxgroup change,vant 单选框,vant框架picker选择器,vant框架picker选择器回显
Vant3 Picker 选择器是一种基于 Vue.js 框架的移动端组件,用于在列表中选择一个或多个值。它可以处理大量数据并支持级联选择。用户可以通过滚动或手动输入来选择选项。

以下是一个简单的 Vant3 Picker 选择器示例,用于选择一个城市:

html
<van-picker
title="选择城市"
:columns="columns"
@confirm="onConfirm"
@cancel="onCancel"
/>


javascript
export default {
data() {
return {
columns: ['北京', '上海', '广州', '深圳', '杭州']
}
},
methods: {
onConfirm(value) {
console.log('选择了城市:', value[0])
},
onCancel() {
console.log('取消选择城市')
}
}
}


在这个例子中,我们定义了一个 van-picker 组件,并传递了一个 columns 属性,该属性包含要显示的城市列表。我们还定义了两个回调函数 onConfirm 和 onCancel,分别在用户完成或取消选择时被调用。当用户完成选择后,onConfirm 函数将打印所选城市的名称。