解决el

2024-07-16 03:27| 来源: 网络整理| 查看: 265

参考文章：原文链接：https://blog.csdn.net/weixin_37342647/article/details/130607274 1.功能：下拉框可输入可多选可全选 2.问题：解决el-select用了远程搜索后，下拉图标不显示问题。问题图片修改后图片原代码：修改：

代码结构：

全选

方法：

reverseArrow(flag) { let rulesDom = this.$refs["my-select"].$el.querySelector( ".el-input .el-input__suffix .el-input__suffix-inner .el-input__icon" ); // 找到dom if (flag) { rulesDom.classList.add("is-reverse"); // 对dom新增class } else { rulesDom.classList.remove("is-reverse"); // 对dom新增class } }, //勾选电站 changeSelect(val) { if (val.length === this.buildList.length) { this.checkBuild = true; } else { this.checkBuild = false; } }, // 全选电站 selectAll() { if (this.checkBuild && this.buildList.length > 0) { if (this.stationName) { this.stationCode = this.sameNameArr.map((item) => item.buildCode); } else { this.stationCode = this.buildList.map((item) => item.buildCode); } } else { this.stationCode = []; } }, // 获取电站列表 searchBuild(value) { console.log(value, "value"); if (value instanceof Event) { value = ""; } if (value) { this.getSameBuildName(value); } else { this.getAllBuild(); } }, getAllBuild() { const requestData = { page: 1, size: 3000, provinceCode: "", cityCode: "", areaCode: "", buildName: "", }; this.$post(selectBuildByUser, requestData).then((res) => { console.log(res); if (res.status === 1) { this.buildList = res.data.rows || []; this.stationCode = this.stationCode.filter((station) => { return this.buildList.some((build) => build.buildCode === station); }); } const allLength = this.buildList.length; const length = this.stationCode.length; if (allLength > 0 && length > 0 && allLength == length) { this.checkBuild = true; } else { this.checkBuild = false; } }); }, getSameBuildName(value) { const requestData = { page: 1, size: 3000, provinceCode: "", cityCode: "", areaCode: "", buildName: value || "", }; this.$post(selectBuildByUser, requestData).then((res) => { console.log(res); if (res.status === 1) { this.sameNameArr = res.data.rows || []; this.buildList = res.data.rows || []; } }); },

【本文地址】

公司简介

联系我们