el-cascader 在子组件中,在父组件怎么清空el-cascader 的值?
时间: 2023-11-21 18:55:09 浏览: 134
可以通过在父组件中使用`ref`来获取子组件的实例,然后调用子组件的`clearChecked`方法来清空`el-cascader`的值。具体实现如下所示:
```html
<template>
<div>
<el-cascader ref="cascader" :options="options" v-model="selectedOptions"></el-cascader>
<el-button @click="clearCascader">清空</el-button>
</div>
</template>
<script>
export default {
data() {
return {
options: [...],
selectedOptions: []
}
},
methods: {
clearCascader() {
this.$refs.cascader.clearChecked();
}
}
}
</script>
```
在上述代码中,我们首先在`el-cascader`组件上添加了`ref="cascader"`属性,这样就可以在父组件中通过`this.$refs.cascader`来获取子组件的实例。然后在`clearCascader`方法中,我们调用了子组件的`clearChecked`方法来清空`el-cascader`的值。最后,在模板中添加了一个按钮,当点击该按钮时,就会调用`clearCascader`方法来清空`el-cascader`的值。
阅读全文