项目场景:
项目上使用cascader级联选择器组件时,初始化时选中数据,再次进入级联选择器只会默认高亮回显展示上次选中数据信息。
问题描述
选择级联选择器时,第二次没有进行销毁组件,因此会导致只会默认高亮上次展示
<el-cascader style="width:180px"
placeholder="请选择数据"
v-model="update.cate"
:props="optionProps"
:options="options"
clearable >
</el-cascader>
optionProps: {
value: 'fixedassetCode', //名称展示
label: 'name', //值展示
checkStrictly: true, //是否严格的遵守父子节点不互相关联
expandTrigger:'click', //次级菜单的展开方式
},
再次进入回显时没有进行销毁组件,可以使用v-if 或者是给组件绑定key产生唯一标识,更新虚拟dom就不会存在回显
<el-cascader style="width:180px"
placeholder="请选择数据"
v-model="update.cate"
:props="optionProps"
:key="cascaderKeysb"
:options="options"
:key='keyvalue'
clearable >
</el-cascader>
在进入选择级联选择器进行更新绑定的key值
++this.cascaderKeysb