fix: 修复Select组件逻辑异常

刘汉宸
1 parent 3c1de253
Showing 1 changed file with 37 additions and 26 deletions Show diff stats
packages/select/index.vue
@@ -104,6 +104,10 @@ export default {
     },
     update: Boolean,
     updateOnce: Boolean,
+    beforeQuery: {
+      type: Function,
+      default: () => true,
+    },
   },
   data() {
     return {
@@ -127,7 +131,7 @@ export default {
     },
     options(val) {
       if (val) {
-        this.optionsCurrent = this.fixOptions([]);
+        this.optionsCurrent = this.fixOptions(this.optionsDataSource);
       }
     },
   },
@@ -207,35 +211,42 @@ export default {
     // 远程加载
     remoteMethod(val = '') {
       const searchText = val.trim();
-      if (searchText.length >= this.triggerSize) {
-        this.loading = true;
-        let requestPrimise;
-        if (this.queryApi) {
-          requestPrimise = this.queryApi(searchText);
+      const isQueryValid = this.beforeQuery(searchText);
+      if (isQueryValid) {
+        if (searchText.length >= this.triggerSize) {
+          this.loading = true;
+          let requestPrimise;
+          if (this.queryApi) {
+            requestPrimise = this.queryApi(searchText);
+          } else {
+            requestPrimise = this.request({
+              url: this.url,
+              method: 'get',
+              params: searchText ? { [this.searchKey]: searchText, ...this.params } : this.params,
+              ...this.config,
+            });
+          }
+          requestPrimise
+            .then(res => {
+              const response = res || {};
+              const options = this.fixOptions(response.result);
+              this.optionsDataSource = options;
+              this.optionsCurrent = options;
+            })
+            .finally(() => {
+              this.loading = false;
+              this.initing = false;
+              this.loaded = true;
+            });
         } else {
-          requestPrimise = this.request({
-            url: this.url,
-            method: 'get',
-            params: searchText ? { [this.searchKey]: searchText, ...this.params } : this.params,
-            ...this.config,
+          this.optionsCurrent = this.optionsDataSource.filter(item => {
+            return item[this.labelKey].includes(val);
           });
         }
-        requestPrimise
-          .then(res => {
-            const response = res || {};
-            const options = this.fixOptions(response.result);
-            this.optionsDataSource = options;
-            this.optionsCurrent = options;
-          })
-          .finally(() => {
-            this.loading = false;
-            this.initing = false;
-            this.loaded = true;
-          });
       } else {
-        this.optionsCurrent = this.optionsDataSource.filter(item => {
-          return item[this.labelKey].includes(val);
-        });
+        this.loading = false;
+        this.initing = false;
+        this.loaded = true;
       }
     },
   },
...	...	@@ -104,6 +104,10 @@ export default {
104	104	},
105	105	update: Boolean,
106	106	updateOnce: Boolean,
	107	+ beforeQuery: {
	108	+ type: Function,
	109	+ default: () => true,
	110	+ },
107	111	},
108	112	data() {
109	113	return {
...	...	@@ -127,7 +131,7 @@ export default {
127	131	},
128	132	options(val) {
129	133	if (val) {
130		- this.optionsCurrent = this.fixOptions([]);
	134	+ this.optionsCurrent = this.fixOptions(this.optionsDataSource);
131	135	}
132	136	},
133	137	},
...	...	@@ -207,35 +211,42 @@ export default {
207	211	// 远程加载
208	212	remoteMethod(val = '') {
209	213	const searchText = val.trim();
210		- if (searchText.length >= this.triggerSize) {
211		- this.loading = true;
212		- let requestPrimise;
213		- if (this.queryApi) {
214		- requestPrimise = this.queryApi(searchText);
	214	+ const isQueryValid = this.beforeQuery(searchText);
	215	+ if (isQueryValid) {
	216	+ if (searchText.length >= this.triggerSize) {
	217	+ this.loading = true;
	218	+ let requestPrimise;
	219	+ if (this.queryApi) {
	220	+ requestPrimise = this.queryApi(searchText);
	221	+ } else {
	222	+ requestPrimise = this.request({
	223	+ url: this.url,
	224	+ method: 'get',
	225	+ params: searchText ? { [this.searchKey]: searchText, ...this.params } : this.params,
	226	+ ...this.config,
	227	+ });
	228	+ }
	229	+ requestPrimise
	230	+ .then(res => {
	231	+ const response = res \|\| {};
	232	+ const options = this.fixOptions(response.result);
	233	+ this.optionsDataSource = options;
	234	+ this.optionsCurrent = options;
	235	+ })
	236	+ .finally(() => {
	237	+ this.loading = false;
	238	+ this.initing = false;
	239	+ this.loaded = true;
	240	+ });
215	241	} else {
216		- requestPrimise = this.request({
217		- url: this.url,
218		- method: 'get',
219		- params: searchText ? { [this.searchKey]: searchText, ...this.params } : this.params,
220		- ...this.config,
	242	+ this.optionsCurrent = this.optionsDataSource.filter(item => {
	243	+ return item[this.labelKey].includes(val);
221	244	});
222	245	}
223		- requestPrimise
224		- .then(res => {
225		- const response = res \|\| {};
226		- const options = this.fixOptions(response.result);
227		- this.optionsDataSource = options;
228		- this.optionsCurrent = options;
229		- })
230		- .finally(() => {
231		- this.loading = false;
232		- this.initing = false;
233		- this.loaded = true;
234		- });
235	246	} else {
236		- this.optionsCurrent = this.optionsDataSource.filter(item => {
237		- return item[this.labelKey].includes(val);
238		- });
	247	+ this.loading = false;
	248	+ this.initing = false;
	249	+ this.loaded = true;
239	250	}
240	251	},
241	252	},
...	...