el-cascader数据回显["上海","市辖区","闵行区"]
时间: 2023-11-16 14:04:44 浏览: 38
要实现el-cascader数据回显["上海","市辖区","闵行区"],需要在v-model中绑定一个数组,数组中的元素依次为省、市、区的名称。具体实现方法如下:
```html
<el-cascader
v-model="selectedOptions"
:options="options"
@change="handleChange"
:props="props"
></el-cascader>
```
```javascript
data() {
return {
selectedOptions: ['上海', '市辖区', '闵行区'],
options: [{
value: '上海',
label: '上海',
children: [{
value: '市辖区',
label: '市辖区',
children: [{
value: '闵行区',
label: '闵行区'
}]
}]
}],
props: {
value: 'label',
children: 'children',
checkStrictly: true
}
}
},
methods: {
handleChange(value) {
console.log(value);
}
}
```
在上述代码中,selectedOptions数组中的元素为["上海","市辖区","闵行区"],options数组中的元素为省、市、区的数据,props对象中的checkStrictly属性设置为true,表示只能选择叶子节点。当用户选择省、市、区时,selectedOptions数组中的元素会自动更新,从而实现数据回显。