防抖:在搜索框 会监听搜索内容的变化,有变化就发送请求,这样比较耗费资源,使用第三方工具包 lodash 的 debounce 方法,在设定的防抖时间内输入内容,不需要发送请求,直到停下搜索,超过设定的时间,才发送请求,没停下之前,一直输入是不会发送请求的
// debounce 函数 // 参数1:函数 // 参数2:防抖时间 // 返回值:防抖之后的函数,和参数1功能是一样的 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 // 该回调将会在侦听开始之后被立即调用
}
},