watch 写法 项目中使用到的地方 用了【handler immediate】 deep 还没找到使用的地方

148 阅读1分钟

注意:watch里面 监听写法:

  1. 普通写法:

toutiao-m: views search index.vue

 watch: {
// 把搜索记录保存到本地存储
SearchHistoryText(value) {
  console.log(123);
  setItem('TOUTIAO_SEARCH_HISTORY', value)
 }
}

2.正式写法 handler函数

toutiao-m: views search search-suggess.vue
// 子组件监听父组件搜索框内容的变化
// lodash 支持按需加载,有利于打包结果优化  1、安装 lodash
import { debounce } from "lodash"
watch: {
searchText: {
  // handler(value) {
  //   console.log(value)
  //   this.loadSearchSuggess(value) // 调用搜索请求
  // },
  handler: debounce(function (value) {  // debounce 是防抖优化的功能 1、安装 lodash
    // console.log(value)
    this.loadSearchSuggess(value)
  }, 200),
  immediate: true // 该回调将会在侦听开始之后被立即调用
}
},

3. 普通写法

    vue-teat  views search  Search-list.vue
        // 监听路由 如果路由发生改变 就再请求查询一次
      watch: {
        $route() {
          this.getData();
        },
      },