VUE ELEMENT UI 清空select 下拉选项

1.select代码
<el-form ref="searchForm" :inline="true" :model="searchForm" label-width="80px">
	<el-form-item label="设备类别" prop="equipmentType">
		<el-select v-model="searchForm.equipmentType.code" clearable @change="getEquipment($event)">
          <el-option v-for="(item, index) in equipmentTypeList" :key="index" :label="item.desc" :value="item.code"></el-option>
		</el-select>
	</el-form-item>
	<el-form-item label="细分类别" prop="equipmentDescType">
		<el-select v-model="searchForm.equipmentDescType.code" clearable>
			<el-option v-for="(item, index) in equipmentDescTypeList" :key="index" :label="item.desc" :value="item.code"></el-option>
		</el-select>
	</el-form-item>
</el-form>
2.JS代码

vm.searchForm.equipmentDescType.code = ‘’;

async getEquipment(event){
    const vm = this;
    vm.dictSearch.dictCodes = [];
    // 清空下拉框
    vm.searchForm.equipmentDescType.code = '';
    vm.dictSearch.dictCodes.push(event);
    const res = await comApiList.dictionaryItemList(vm.dictSearch);
    if (res.data.code === 0) {
        const data = res.data.data;
        if (data) {
            vm.equipmentDescTypeList = data[event];
        }
    } else {
        vm.$message({
            message: res.data.msg,
            type: "error"
        });
    }
}
3.最后测试一下

在这里插入图片描述

在这里插入图片描述

Logo

前往低代码交流专区

更多推荐