摘要:一監聽數組實際上可以監聽數組變化,比如監聽在比如使用從數組下標刪除兩個元素,并在下標插入一個元素監聽數組也能夠監聽到二無法監聽數組變化的情況但是數組在下面兩種情況下無法監聽利用索引直接設置數組項時,例如修改數組的長度時,例如舉例無法監聽數組
一、vue監聽數組
vue實際上可以監聽數組變化,比如
data () { return { watchArr: [], }; }, watchArr (newVal) { console.log("監聽:" + newVal); }, created () { setTimeout(() => { this.watchArr = [1, 2, 3]; }, 1000); },
在比如使用splice(0,2,3)從數組下標0刪除兩個元素,并在下標0插入一個元素3
data () { return { watchArr: [1, 2, 3], }; }, watchArr (newVal) { console.log("監聽:" + newVal); }, created () { setTimeout(() => { this.watchArr.splice(0, 2, 3); }, 1000); },
push數組也能夠監聽到
二、vue無法監聽數組變化的情況
但是數組在下面兩種情況下無法監聽
利用索引直接設置數組項時,例如arr[indexofitem]=newValue
修改數組的長度時,例如arr.length=newLength
舉例無法監聽數組變化的情況
1、利用索引直接修改數組值
data () { return { watchArr: [{ name: "krry", }], }; }, watchArr (newVal) { console.log("監聽:" + newVal); }, created () { setTimeout(() => { this.watchArr[0].name = "xiaoyue"; }, 1000); },
2、修改數組的長度
長度大于原數組就將后續元素設置為undefined
長度小于原數組就將多余元素截掉
data () { return { watchArr: [{ name: "krry", }], }; }, watchArr (newVal) { console.log("監聽:" + newVal); }, created () { setTimeout(() => { this.watchArr.length = 5; }, 1000); },
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/109598.html
摘要:定義是一個計算屬性類似于過濾器對綁定到的數據進行處理用法不可在里面定義如果定義會報如下圖片的錯誤因為對應的作為計算屬性定義并返回對應的結果給這個變量變量不可被重復定義和賦值和用法回調函數當需要讀取當前屬性值是執行,根據相關數據計算并返回當前 1.computed 1.1 定義 是一個計算屬性,類似于過濾器,對綁定到view的數據進行處理 1.2 get用法 data: { ...
摘要:定義是一個計算屬性類似于過濾器對綁定到的數據進行處理用法不可在里面定義如果定義會報如下圖片的錯誤因為對應的作為計算屬性定義并返回對應的結果給這個變量變量不可被重復定義和賦值和用法回調函數當需要讀取當前屬性值是執行,根據相關數據計算并返回當前 1.computed 1.1 定義 是一個計算屬性,類似于過濾器,對綁定到view的數據進行處理 1.2 get用法 data: { ...
摘要:響應式數據響應式數據不是憑空出現的。對于對象而言,如果是之前不存在的屬性,首先可以將進行響應化處理比如調用,然后將對具體屬性定義監聽比如調用函數,最后再去做賦值,可能具體的處理過程千差萬別,但是內部實現的原理應該就是如此僅僅是猜測。 前言 首先歡迎大家關注我的Github博客,也算是對我的一點鼓勵,畢竟寫東西沒法獲得變現,能堅持下去也是靠的是自己的熱情和大家的鼓勵。 國內前端算...
摘要:最近用做了兩個項目,都需要實現全選反選的功能,兩個項目用了兩種實現方法,第一個項目用的,第二個項目用指令來實現,用起來,發覺指令更加方便。至此,一個全選的指令就完成了。 最近用vue做了兩個項目,都需要實現全選反選的功能,兩個項目用了兩種實現方法,第一個項目用vue的computed,第二個項目用指令來實現,用起來,發覺指令更加方便。 第一次做全選的時候是剛開始接觸vue不久,全選的實...
摘要:后兩個屬性可選。屬性定義了項目的縮小比例,默認為,即如果空間不足,該項目將縮小。屬性定義了在分配多余空間之前,項目占據的主軸空間。它的默認值為,即項目的本來大小。結合的異步組件和的代碼分割功能,輕松實現路由組件的懶加載。 項目總結 這是我第二個用 Vue 實現的項目,下面內容包括了在實現過程中所記錄的知識點以及一些小技巧 項目演示地址:https://music-vue.n-y.io源...
閱讀 1822·2023-04-26 02:32
閱讀 571·2021-11-18 13:12
閱讀 2455·2021-10-20 13:48
閱讀 2521·2021-10-14 09:43
閱讀 3832·2021-10-11 10:58
閱讀 3496·2021-09-30 10:00
閱讀 2936·2019-08-30 15:53
閱讀 3493·2019-08-30 15:53