fix: 优化资讯搜索交互方式

slimkit · Jul 4, 2018 · b3eb5de · b3eb5de
1 parent 33e9beb
commit b3eb5de
Showing 1 changed file with 11 additions and 6 deletions.
diff --git a/src/page/news/newsSearch.vue b/src/page/news/newsSearch.vue
@@ -57,12 +57,17 @@ export default {
     }
   },
   methods: {
-    searchNewsByKey: _.throttle(function() {
-      this.keyword &&
-        searchNewsByKey(this.keyword).then((list = []) => {
-          this.list = list;
-        });
-    }, 1e3),
+    /**
+     * 使用 lodash.debounce 节流，每输入 600ms 后执行
+     * 不要使用箭头函数，会导致 this 作用域丢失
+     * @author mutoe <[email protected]>
+     */
+    searchNewsByKey: _.debounce(function() {
+      if (!this.keyword) return;
+      searchNewsByKey(this.keyword).then((list = []) => {
+        this.list = list;
+      });
+    }, 600),
     onRefresh(callback) {
       searchNewsByKey(this.keyword, 15).then(list => {
         this.list = list;