1：準備數據：

data () {return {//主要搜索的對象數組questionArrayList : {questionName : "",questionValue : ""},//搜索的文本框searchText : ""}},computed: { //設置計算屬性}

2：解決過程：

<div slot="extra"><a-radio-group></a-radio-group><a-input-search @search="searchQuestion" v-model="searchText" style="margin-left: 16px; width: 272px;" /></div>

v-model="searchText"綁定文本框的數據，進行獲取。

<div slot="extra"><a-radio-group></a-radio-group><a-input-search @search="searchQuestion" v-model="searchText" style="margin-left: 16px; width: 272px;" /></div>

@search="searchQuestion"綁定搜索事件，

search函數進行對我需要的問題對象數組進行操作。

searchQuestion() {if (!this.searchText) {return this.questionArrayList;}else{return this.questionArrayList.filter((value)=>{return value.questionName.includes(this.searchText)})}}

1：如果輸入框為空，我返回原來的數組對象，即不操作，

2：如果輸入框不為空，我進行過濾返回包含文本框的新的對象集合（原來的questionArrayList未改變。

總結

以上是生活随笔為你收集整理的vue简单实现模糊搜索的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。