// 获取联想菜单
getSearchSuggFn () {
//>>>>>>>防抖
// 1. 关闭 上一次 延迟器
if (this.timerId) {
clearTimeout(this.timerId)
}
// 2. 重新开启一次延迟器,如果在 500 毫秒之内又
// 再次 输入了,那么这个延迟器 就会 被 关闭
this.timerId = setTimeout(async () => {
if (!this.keyword) return
// 调用 联想菜单 接口 - 获取数据
const resp = await getSearchSuggListAPI({
keyword: this.keyword
})
//>>>>>>>>
// 数据 预处理
// 数据 预处理思想:后端返回的数据 在赋值 给 vue数据变量之前,
// 在赋值之前的数据处理称之为数据预处理
//>>>>>>>>>>>字符串去空格
const { options } = resp.data
// 1. for循环版本
// for (let i = 0; i < options.length; i++) {
// options[i] = options[i].replace(/ /g, '')
// }
// 2. forEach版本
// options.forEach((str, idx) => {
// options[idx] = str.replace(/ /g, '')
// })
// 3. map版本
this.suggList = options.map(str => str.replace(/ /g, ''))
}, 500)
},
vue防抖和节流
最新推荐文章于 2024-07-09 22:07:57 发布