vue 树和级联选择器 el-cascader @change 获取全部值

最新推荐文章于 2024-07-30 16:49:30 发布

tanzongbiao

最新推荐文章于 2024-07-30 16:49:30 发布

阅读量2.2k

点赞数

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

本文链接：https://blog.csdn.net/tanzongbiao/article/details/131108830

版权

Vue 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

// 树和级联选择器
dataTree: [],
categoryTreeProps: {
  value: 'areaId',
  label: 'areaName'
},
selectedOptions: []

<el-form-item label="省市区" prop="addrProvince">
  <el-cascader
    ref="cascader"
    v-model="selectedOptions"
    expand-trigger="hover"
    :options="dataTree"
    :props="categoryTreeProps"
    change-on-select
    filterable
    style="width:360px"
    @change="handleChange"
  />
</el-form-item>

// 级联选择器选值变更
handleChange(val) {
  // el-cascader @change 获取全部值
  const checkedNodes = this.$refs['cascader'].getCheckedNodes()
  const pathLabels = checkedNodes[0].pathLabels
}