1、级联选择器的model-value / v-model 应该是一个数组,不是字符串
<el-cascader
v-model="[1,2,3]"
:options="options"
@change="handleChange"></el-cascader>
2、生命周期的问题,使用$nextTick 函数,在函数里进行赋值
<template>
<div class="block">
<el-cascader
v-model="groupList"
:options="options"
@change="handleChange"></el-cascader>
</div>
</template>
<script>
export default {
import { defineComponent, onMounted, reactive, toRefs } from 'vue'
export default defineComponent({
setup (props, context) {
const data = reactive({
groupList: [],
options:[]
})
onMounted(() => {
let list=proxy.$store.state.list
proxy.$nextTick(function () {
data.groupList = list
})
return {
...toRefs(data)
}
})
}
</script>
3、给组件绑定一个key 更新key的值实现组件重新加载
<el-cascader
v-model="[1,2,3]"
:options="options"
:key="index"
@change="handleChange"></el-cascader>
写在最后,欢迎大家留言~