js 节流方式下实现搜索

home.vue
<template>
<div>
   <Input v-model.trim="input" placeholder="输入车牌号" @keyup.native="searchCarCode" clearable />
</div>
</template>

<script>
import util from '@/lib/utils'

export default {
  data(){
    return{
      input:'',
  }  
},
methods:{

    searchCarCode:util._Throttle(function(){
              console.log(this.form1.car)
              this.search();
          },1000),
    search(){
              if (!this.input) {
                  this.$Message.error('请输入车牌号');
                  return false
              }
              this.$axios({
                  method:'get',
                  params:{
                      input:this.input,
                      index:0,
                      size:20
                  },
                  url:'/'
              })
                  .then(res =>{
                      this.items = res.data.data;
                  })


          },
}




}



<script>

utils.js
//节流
let util = {}
util._Throttle  = (fn,t) =>{
    let last,
        timer,
        interval = t || 500;
    return function () {
        let args = arguments;
        let now =+ new Date();
        if(last && now - last < interval){
            console.log(new Date(last))
            clearTimeout(timer);
            timer =  setTimeout(()=>{
                last = now;
                fn.apply(this,args);
            },interval)
        }else {
            /*最开始执行这一段*/
            last = now;
            fn.apply(this,args);
        }
    }
}
export default util;

https://blog.csdn.net/qq_37746973/article/details/78402812

js防抖和节流
参考