注意:watch里面 监听写法:
- 普通写法:
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();
},
},