300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > vue 实时搜索 防抖功能

vue 实时搜索 防抖功能

时间:2020-01-20 12:01:39

相关推荐

vue 实时搜索 防抖功能

最近在做实时搜索功能时,被要求使用防抖函数,就自己手写一个,已用于大型项目中

<template><el-input placeholder="请搜索关键字" @input="inputHandle" v-model="input4"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input></template>export default{data(){timeId: undefined,isLoading: false,input4: ''},methods:{inputHandle(val){this.input4 = val/*以下为防抖代码*/if (!this.timeId && !this.isLoading) {this.guidanceTailList()}if (this.timeId) {clearTimeout(this.timeId)}this.timeId = setTimeout(() => {this.timeId = undefinedclearTimeout(this.timeId)this.guidanceTailList()}, 2500)/*以上为防抖代码*/},guidanceTailList(){this.isLoading=true......省略ajax请求...this.isLoading=false}}}

总结–:自己平常没事的时候就会看看基础API,巩固一下基础,这样,在封装公共组件或者公共方法时,就不会手忙脚乱,毫无头绪了! 现在的努力,总会在将来的某个不经意的时间收到回报的,加油!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。