vant Cascader 级联选择可以选择任意一层级

最新推荐文章于 2025-02-20 10:46:52 发布

置顶 i紸定i

最新推荐文章于 2025-02-20 10:46:52 发布

阅读量4.5k

点赞数 3

分类专栏：前端文章标签：前端 javascript vue js

本文链接：https://blog.youkuaiyun.com/qq_38508172/article/details/131696751

版权

前端专栏收录该内容

6 篇文章

订阅专栏

文章展示了如何在Vue.js应用中利用van-cascader组件监听change事件，更新选定值selectedValue。当用户选择任一选项时，handleCascaderChange方法被触发，更新当前选中的层级选项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

通过使用change事件，来实现选择任意一层级

<template>
  <div>
    <van-cascader
      :options="options"
      :value="selectedValue"
      @change="handleCascaderChange"
    ></van-cascader>
  </div>
</template>

data() {
  return {
    options: [
      { value: '1', label: 'Option 1', children: [...] },
      { value: '2', label: 'Option 2', children: [...] },
      ...
    ],
    selectedValue: [] // 记录选择值
  };
},
methods: {
  handleCascaderChange(value) {
    this.selectedValue = value;
  }
}