nuxt中输入框输入展示下拉防抖

发布日期： 2024-09-02 15:24 阅读量： 121 来源： 互联网

模板部分

<input type="text" name="s" value="" placeholder=" "

class="ui-autocomplete-input" @input="getresult()" v-model="s" @click.stop>

js部分

getresult(){

if (this.s && this.s.length>2){

let that = this

if(that.timer) clearTimeout(that.timer)

// 设立新的定时器

that.timer = setTimeout(function () {

// console.log(that.s)

if (that.stimer != that.s){

that.$axios.post("/site/product/index",{search_text:that.s})

.then((res)=>{

// console.log(res)

if (res.status == 200) {

that.resultlist = res.data.list.data

that.resultshow=true

}

})

// console.log(that.stimer,that.s)

that.stimer = that.s

}

}, 1000)//delay

// let s = this.s

// this.tool.debounce(

// // console.log("333"),1000)

// function(s){

// console.log("111")

// }

// ,1000)

// this.$axios.post("/site/product/index",{search_text:this.s})

// .then((res)=>{

// // console.log(res)

// if (res.status == 200) {

// this.resultlist = res.data.list.data

// this.resultshow=true

// }

// })

}else{

this.resultshow=false

}

随便看看