elementui-Cascader-多选模式,里面小按钮删除获取getCheckedNodes问题

2,287 阅读1分钟

Cascader-多选模式,里面小按钮删除获取getCheckedNodes问题

问题描述

image.png

  1. 图中有两处删除按钮
  2. 使用图中箭头1【删除】按钮或者聚焦使用键盘【Backspace】按钮,删除数据时,获取getCheckedNodes有问题
  3. 使用图中箭头2,清空和展开选择删除,没有问题

展示代码

<el-form-item label="商品分类">
    <el-cascader class="cascader" ref="cascader" v-model="categoryId" :options="category"
        :props="{ label:'label', value:'id', multiple: true }" placeholder="请选择" filterable
        clearable separator=">" collapse-tags @change="spflChange" style="width:300px;">
    </el-cascader>
</el-form-item>

解决方法

methods:{
    spflChange (item) {
        var nodes = this.$refs['cascader'] &&this.$refs['cascader'].$refs.panel.getCheckedNodes()
        console.log('item',item)
        console.log('nodes1',nodes) //此时的nodes不是最新的
        //解决方法
        this.$nextTick(_=>{
            console.log('nodes2',nodes) //此处打印是最新值
        })
    }
}