本文若对你有用,给个免费 Star 和关注,持续输出前端各种稀奇古怪的问题

所实现的效果如图

time.gif

代码如下,注释齐全, 粘贴即用:

<template>
<el-input size="mini" v-model="input" 
  placeholder="全局搜索(空格或逗号)" @input="handleSearch"></el-input>
</template>
<script>
export default {
  data(){
    return {
      // 用于清除定时器setInterval
      timmer: null
    }
  },
  methods: {
    handleSearch(value){
      // 输入框 input事件, 输入结束后0.5秒触发
      clearInterval(this.timmer)
      this.timmer = setInterval(()=>{
        console.log('', value);
        // 事件触发后,清除定时器
        clearInterval(this.timmer)
      }, 500)
    },
}