Skip to content

防抖(定时器版本)

javascript
<view class="search-box">
     <!-- 使用 uni-ui 提供的搜索组件 -->
     <uni-search-bar @input="input" :radius="100" cancelButton="none" placeholder="请输入" focus="true"></uni-search-bar>
   </view>
javascript
data() {
      return {
        // 延时器的 timerId
        timer: null,
        // 搜索关键词
        kw: '',
        searchResults: [],
        historyList: []
      }
    },
javascript
input(e) {
         // 清除 timer 对应的延时器
          clearTimeout(this.timer)
        // e.是最新的搜索内容
        this.timer = setTimeout(()=>{
          this.kw = e
          this.getSearchResults()
        }, 500)
      },
javascript
async getSearchResults(){
        if(this.kw.trim() === ''){
          this.searchResults = []
          return
        }
         const {data : res} = await uni.$http.get('/api/public/v1/goods/qsearch', {query: this.kw })
         // console.log(res);
         if(res.meta.status !== 200){
          return uni.$showMsg()
         }
         this.searchResults = res.message
         this.saveSearchHistory()
         console.log(this.searchResults);
          
      },