搜索栏输入框输入后自动搜索功能

最新推荐文章于 2023-10-20 15:34:14 发布

原创最新推荐文章于 2023-10-20 15:34:14 发布 · 2k 阅读

2 ·

CC 4.0 BY-SA版权

uni-app 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一个基于Vue.js的自动搜索功能实现方案。通过监听输入框的内容变化并使用防抖技术来减少不必要的请求，确保只有当用户停止输入一段时间后才触发搜索操作。此方法能有效提升用户体验同时减轻服务器负担。

作用：顶部搜索栏搜索框填写完内容后让其自动搜索；代码如下；

    watch: {
      'params.order_sn'(newVal,oldVal){
    	  //添加空格不做处理
    	  if(newVal.trim() == oldVal.trim()) return;
    	  // 输入框防抖 
    	  clearTimeout(this.debounceTimer);
    	  this.debounceTimer = setTimeout(()=>{
    		  //输入框没值了，清空搜索框条件数据
    		  this.params.page = 1
    		  this.getOutwareHouse(this.params);
    	  },500) //几毫秒进行
      }
    },

以上内容仅供参考；