您好,登錄后才能下訂單哦!
問題描述
Vue提供了一個watch方法可以讓使用者去監聽某些data內的數據變動,觸發相應的方法,比如
queryData: { name: '', creator: '', selectedStatus: '', time: [], },
第一種解決方案:直接對象
現在我需要監聽這個queryData,我可以這樣做:
watch: { queryData: { handler: function() { //do something }, deep: true } }
第二種解決方案:deep
里面的deep設為了true,這樣的話,如果修改了這個queryData中的任何一個屬性,都會執行handler這個方法。不過其實這樣開銷是蠻大的,尤其是對象里面結構嵌套過深的時候。而且有時候我們就想關心這個對象中的某個屬性,比如name,這個時候可以這樣
watch: { 'queryData.name': { handler: function() { //do something }, } }
第三種解決方案:(computed+watch)
或者還可以這樣巧用計算屬性
computed: { getName: function() { return this.queryData.name } } watch: { getName: { handler: function() { //do something }, } }
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持億速云。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。