vue 中watch 回调函数和methos中方法的区别

标签：searchkey vue last methos watch throttle now

1.vue 中代码

<el-input v-model="searchkey" placeholder="键名" @input="handleInput" clearable style="max-width:300px;"></el-/utils/commonwen文件加下

export function _throttle(fn,wait = 300){
  let last,now
  console.log("last111111111:",last)
  return function(){
    console.log("last:",last)
    now = new Date().getTime()
    if(last && now -last < wait){
      last = now
    }else{
      last = now
      fn.call(this,...arguments)
    }
  }


vue 页面中
import { _throttle } from '@/utils/common' 
methods:{
   /*********使用这种方式调用每次都会打印 last111111111111***********/
    handleInput () {
      _throttle(()=>{
         this.getList()
       })()
     }  
}

　watch: {      /************使用这种方式第一次页面刷新的时候会调用last11111111，改变 searchkey 只会打印last **********************/      searchkey:_throttle(function(){        console.log('22222222222')        this.getList()      })   }

　　2.综上：
　watch 定义的时候函数已经定义，后面改变searchkey的值只会改变定义过函数内的内容

标签：searchkey,vue,last,methos,watch,throttle,now
From： https://www.cnblogs.com/moon-yyl/p/16836991.html