vue 中使用 lodash Debounce防抖不生效

需求：搜刮按钮增长防抖功能
代码1

1. <template>
2.     <el-button  type="primary" icon="el-icon-search" @click="searchClick">搜索</el-button>
3. </template>
4.   
5.   <script>
6. import { debounce } from "lodash";
7. // 自定义搜索按钮，带防抖
8. export default {
9.     name: "SearchButton",
10.     props: {
11.         //默认等待1秒
12.         wait: {
13.             type: Number,
14.             default: 1000
15.         }
16.     },
17.     components: {},
18.     data () {
19.         return {
21.         };
22.     },
23.     mounted () {
24.         //防抖函数
25.         this.debounceClick=debounce(function(){
26.               console.log(111111);
27.          },this.wait)
28.      },
29.     methods: {
30.         /**
31.          * 点击事件
32.          */
33.         searchClick () {
34.             this.debounceClick()
35.         }
36.         //或是
37.         searchClick :debounce(function(){
38.               console.log(111111);
39.          },this.wait)
40.     }
41. };
42.   </script>
43.   

复制代码

参考：
https://vuejs.org/guide/essentials/reactivity-fundamentals.html#stateful-methods

注：debounce返回的是一个函数，debounce后面增长()或直接在点击事件中调用是不可的

1. searchClick () {
2.         //不执行
3.        debounce(function(){
4.          console.log(111111);
5.          },this.wait)
6. }

复制代码

1. searchClick () {
2.    //每次都执行
3.          debounce(function(){
4.               console.log(111111);
5.          },this.wait)()
6. }

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。