在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue中關(guān)鍵字過濾數(shù)組

vue中關(guān)鍵字過濾數(shù)組

clipboard.png

queryData是v-model綁定的值

sourceData是數(shù)組

想讓這個(gè)數(shù)組根據(jù)關(guān)鍵字變化 返回過濾后的數(shù)據(jù)

但是不能改變數(shù)據(jù)源

求大神教下該怎么寫

clipboard.png

變成這樣？ 還是不好使啊

clipboard.png

就是根據(jù)輸入的關(guān)鍵字過濾數(shù)組

watch:{

queryData(val){
    if(val){
        return this.sourceData.filter((el,index,self)=>{
            return el.name.indexOf(val) >-1;
        })
    }
}

}

數(shù)據(jù)源是不應(yīng)該變化的 但是渲染的應(yīng)該變化 這樣寫頁面上還是沒變化

回答
編輯回答
菊外人

用 computed 而不是 watch.

computed:{

    filterdData(){
        if(this.queryData){
            return this.sourceData.filter((el,index,self)=>{
                return el.name.indexOf(this.queryData) >-1;
            })
        }
        
        return [];
    }
}

在模板中使用 filterdData 來獲取過濾后的數(shù)據(jù). 用 sourceData 顯示全部數(shù)據(jù).

2018年1月23日 23:24
編輯回答
別硬撐
queryData(){
    ...
    return this.sourceData.filter...
    ...
}

請(qǐng)貼 完整 代碼
這明顯是不對(duì)的，你監(jiān)聽queryData的改變，然后去改變queryData？而如果不是你要改變的是什么，這在問題里根本沒有體現(xiàn)。

2018年6月23日 21:18