胡1杨 2022-04-15 19:25 采纳率: 20%
浏览 20

element级联多选能不能一次性拿到所有已选择的数据

公司新的产品需求是这样的,省市区,拿到之后存在数据库,value值倒是拿到了,但是需要回显出省市区的名字label,网上搜了一下使用级联的change时间获取ref的getCheckedNodes这个方法就可以获取当前选择的省市区,但是我要的是选择全部的数据类型啊!

img


img

img

img

类似这种的数据格式,

img

  • 写回答

1条回答 默认 最新

  • 会飞的咕咕鱼 2022-04-18 17:26
    关注

    下面例子可以获取选中value集合,label集合, 以及label和value都有的 ,看你需要哪个this.checkedNodes 就push哪个就行了

    img

    <template>
      <el-cascader-panel ref="panel" :props="{ multiple: true }" :options="options" @change="handleChange"></el-cascader-panel>
    </template>
    
    <script>
      export default {
        data() {
          return {
            options: [{
              value: '1',
              label: '北京',
              children: [{
                value: '01',
                label: '北京市',
                children: [{
                  value: '0011',
                  label: '朝阳区'
                }, {
                  value: '0012',
                  label: '海淀区'
                }, {
                  value: '0013',
                  label: '西城区'
                }, {
                  value: '0014',
                  label: '东城区'
                }]
              }]
            },{
              value: '2',
              label: '上海',
              children: [{
                value: '02',
                label: '上海市',
                children: [{
                  value: '0021',
                  label: '静安区'
                }, {
                  value: '0022',
                  label: '闵行区'
                }, {
                  value: '0023',
                  label: '宝山区'
                }, {
                  value: '0024',
                  label: '奉贤区'
                }]
              }]
            }],
            checkedNodes:[]
          };
        },
        methods: {
          handleChange(){
            this.checkedNodes = [];
            const nodes = this.$refs.panel.getCheckedNodes();
            nodes.forEach(v=>{
              const pathNodes = [];
              v.pathNodes.forEach(item=>{
                pathNodes.push({label: item.label, value:item.value});
              })
              this.checkedNodes.push([v.path,v.pathLabels,pathNodes])
            })
            console.log(this.checkedNodes)
          }
        }
      };
    </script>
    
    
    评论

报告相同问题?

问题事件

  • 创建了问题 4月15日

悬赏问题

  • ¥15 python怎么在已有视频文件后添加新帧
  • ¥20 虚幻UE引擎如何让多个同一个蓝图的NPC执行一样的动画,
  • ¥15 fluent里模拟降膜反应的UDF编写
  • ¥15 MYSQL 多表拼接link
  • ¥15 关于某款2.13寸墨水屏的问题
  • ¥15 obsidian的中文层级自动编号
  • ¥15 同一个网口一个电脑连接有网,另一个电脑连接没网
  • ¥15 神经网络模型一直不能上GPU
  • ¥15 pyqt怎么把滑块和输入框相互绑定,求解决!
  • ¥20 wpf datagrid单元闪烁效果失灵