vue inputのリアルタイム検索を実現
私はみんなが私と同じように怠け者であることを知っていて、うん~o(̄▽̄)o、顔を出さずにそう思って、へへ、次は直接コードをつけます
漢字入力を実現してスペースをクリックした後、検索連続入力を最後に500 ms間隔で入力します.
<input v-model="keyword" @input="searchEvent" />
data() {
return {
keyword: '',
timer: null,
len: false
}
},
漢字入力を実現してスペースをクリックした後、検索連続入力を最後に500 ms間隔で入力します.
searchEvent() {
this.clearTimer()
if (this.keyword && this.keyword.length > 0) {
this.len = true
this.timer = setTimeout(() => {
console.log(this.keyword)
//
}, 500)
} else {
if (this.len) {
console.log(this.keyword)
//
}
if (this.keyword === '') {
this.len = false
return
}
}
},
clearTimer() {
if (this.timer) {
clearTimeout(this.timer)
}
},