Element UI 主动清空Cascader级联选择器Select选择器
在Element UI的实际使用中,会碰见需要根据特定条件自动清空已经选择的Select内容或者Cascader内容,这个普通的数据重置方法不会让选项重置,内容是没有了,但是Select的状态还是有内容的状态;
所以此时就需要使用
this.$set(this.form, "taskType", "");
来对数据选项以及数据进行重置。
<template> <el-select v-model="form.value" clearable placeholder="请选择"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option> </el-select> <el-button type="primary" @click="resetClick">重置按钮</el-button> </template> <script> export default { data() { return { options: [{ value: '0', label: '黄金糕' }, { value: '1', label: '双皮奶' }, { value: '2', label: '蚵仔煎' }, { value: '3', label: '龙须面' }, { value: '4', label: '北京烤鸭' }], form: { value: '', }, } }, methods: { resetClick() { this.$set(this.form, "value", ""); }, }, } </script>
文章评论