vue 組件屬性監聽_vuejs組件內的對象屬性監聽問題

跟數據類型是有關的。

當你把一個普通的 JavaScript 對象傳給 Vue 實例的 data 選項,Vue 將遍歷此對象所有的屬性,并使用 Object.defineProperty 把這些屬性全部轉為 getter/setter。

但是不是所有的變動都可以通過set/get捕捉到,比如一個數組

let a = [1, 2, 3]

a[0] = 2 // 這個就是沒法通過set/get捕捉到的變動,所以不能觸發vue的響應式更新

this.$set(a, 0 ,2) //這樣就可以

a.splice(0, 1, 2) //這樣也可以

又比如一個對象

let a = {

name : 'gg'

}

a.name = 'ok' // 會觸發dom更新

a.age = 18 //不會觸發dom更新,因為在vue‘改造’a對象的時候,不存在age屬性,顯然沒辦法給它添加getter/setter

因此當你對數組進行操作時,可以使用vue提供的8個數組變異方法來保證觸發響應式更新:

push()

pop()

shift()

unshift()

splice()

sort()

reverse()

當你需要給一個對象添加屬性時,使用 Vue.set(vm.someObject, 'b', 2) 或者 this.$set(this.someObject,'b',2)

當然,構造新的對象/數組然后重新賦值也是可以的

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/540106.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/540106.shtml
英文地址,請注明出處:http://en.pswp.cn/news/540106.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

Part 2: Containers

要求 安裝了1.13或者更高版本的Docker閱讀了Part1中的定位(我沒寫)介紹 是時候用Docker構建一個app了。我們會從構建這樣一個app的最底層開始,容器——我們這節所介紹的內容。在這層之上是服務,服務定義了容器們的在生產中的行為&…

(論文)WS-DAN (弱監督數據增強)

背景 近期在做外賣分類的項目,外賣分類屬于細粒度圖像分類,在分類的過程中要從圖片的行人中和非機動車中區分出各類外賣(主要是美團、餓了嗎)。剛好近期發現了一片關于細粒度圖像分類較新的論文(See Better Before Lo…

羅馬音平假名片假名轉換器_關于五十音你所要知道的一切!文末附日網高清字帖...

今天開始,木子小花日本語教室將開始同時更新日語文法系列文章 和 日語真題詳解系列文章,從五十音圖的記憶方法到日語助詞的用法整理,從N5的簡單句子構成到N1復雜文法的接續記憶方法,力求做出全知乎(小聲:全…

django的web開發筆記1(智能診斷系統數據概覽記錄)

接于上一篇,這一篇主要記錄如何鏈接mysql數據庫以及從數據庫中調用數據信息到頁面,同時包含百度地圖api的一些使用。 其中包括模塊,echert圖表繪制數據調用,百度地圖數據信息調用以及一些單機效果,頁面數據調用等。 1…

Spring中應用反射機制淺析

我們知道,Spring中大量使用了反射機制,那么究竟是什么地方使用了呢?就從源頭說起吧。 一 反射源頭Class類 對類的概念我們已經非常熟悉了。比如可以有Student這個類,Person這個類。但是我們要知道,有一個叫Class的類,…

ios nslog 例子_iOS開發-使用宏自定義輸出(NSLog)

前言:1)輸出日志是會大量損耗系統性能2)輸出的信息很容易會被截取到,導致信息不安全。所以我們會在發行版(Release)取消所有的Log。如果一行一行地去注釋掉Log,顯然不是一個明確的選擇。因此我們可以使用宏去自定義Log輸出。最簡單的一個例子…

python小技巧積累--題庫(持續更新)

介紹 作為一名程序員,除了需要具備解決問題的思路以外,代碼的質量和簡潔性也很關鍵。 python內置庫中就有很多簡潔而又優雅的操作,這里的知識都來源于網絡積累, 閑暇時整理下來方便溫故。目錄 >選擇正確的內置功能 使用enum…

提高SQL執行性能方案:如何讓你的SQL運行得更快

---- 人們在使用SQL時往往會陷入一個誤區,即太關注于所得的結果是否正確,而忽略了不同的實現方法之間可能存在的性能差異,這種性能差異在大型的或是復雜的數據庫環境中(如聯機事務處理OLTP或決策支持系統DSS)中表現得尤…

休眠后gpio狀態_STM32中GPIO的8種工作模式總結

STM32中GPIO的8種工作模式總結一、推挽輸出:可以輸出高、低電平,連接數字器件;推挽結構一般是指兩個三極管分別受兩個互補信號的控制,總是在一個三極管導通的時候另一個截止。高低電平由IC的電源決定。形象點解釋:推挽&#xff0c…

Ubuntu16.04 下 tensorRT安裝

環境準備 主要是根據工程環境需要,參考trt文檔安裝trt 1.查看trt適配情況 :鏈接跳轉,注意,不同版本的trt有不同版本的文檔,請以最新文檔為準。 2.根據自己系統情況下載相關包 因為我自己拉的docker鏡像是ubuntu16.04…

左右xcode的重構選項的一些理解

Rename(重命名):對標示符進行重命名,以獲得更好的代碼可讀性,這些標示符包含類,方法或者函數的名稱. Extract(抽取):將你在XCode種選擇的代碼抽取到一個新的方法或函數中. Create SuperClass(創建父類):為Xcode中當前所選的類定義父類 Move Up(上移):將所選擇的方法,屬性,或實例…

window 如何查看tomcat 實時日志_如何處理生產環境Tomcat的catalina.out日志?

前語:不要為了讀文章而讀文章,一定要帶著問題來讀文章,勤思考。作者:jmcui 來源:http://1t.click/x4q# 前言隨著每天業務的增長,Tomcat 的catalina.out日志 變得越來越大,占用磁盤空間不說。要…

zabbix的agent端的主動模式關鍵三個參數

如多主機超過300和隊列內容過多,就采用主動模式. [rootweb03 zabbix]# egrep -v "^#|^$" zabbix_agentd.conf PidFile/var/run/zabbix/zabbix_agentd.pid LogFile/var/log/zabbix/zabbix_agentd.log LogFileSize0 StartAgents0 ServerActive172.16.1.8 Hostnameweb03…

opencv 繪制坐標曲線_OpenCV手工實現灰度及RGB直方圖

#include #include#include#include#include#include#include#include#includeusing namespacecv;using namespacestd;//單通道圖片直方圖繪制void drawHist(vectornums){Mat hist Mat::zeros(600, 800, CV_8UC3);auto Max max_element(nums.begin(), nums.end());//max迭代器類…

onnx 測試_用于ONNX的TensorRT后端

用于ONNX的TensorRT后端解析ONNX模型以使用TensorRT執行。另請參閱TensorRT文檔。有關最近更改的列表,請參見changelog。支持的TensorRT版本Master分支上的開發適用于具有完整維度和動態架構shape支持的TensorRT 7.2.1的最新版本。對于TensorRT的早期版本&#xff0…

paddlepaddle測試安裝_百度paddlepaddle深度學習7日入門-CV疫情特輯心得

正值疫情嚴重之日,作為一名研究生被迫待在家里學習,手頭的科研項目也嚴重受挫。。。偶然間,看到微信公眾號發布這門課,馬上報名,入坑!!!瞬間疫情其間有學習的目標了。。該課程學習依…

apache目錄 vscode_VsCode搭建Java開發環境(Spring Boot項目創建、運行、調試)

VsCode搭建Java開發環境(Spring Boot項目創建、運行、調試)安裝如下兩個主要擴展即可,這兩個擴展已關聯java項目開發主要使用的maven、springboot等所需要的擴展。開始步驟:在 Visual Studio Code 中打開擴展視圖(CtrlShiftX)。輸入“java”搜索商店擴展…

android dp轉px的公式_Android特效專輯——自定義不一樣的Toast

大家都知道,Android的控件有時候很難滿足我們的需求,所以我們需要自定義View。自定義的方式很多,有繼承原生控件也有直接自定義View的,今天寫的是自定義的Toast,當然,這個不是復寫Toast,是換一種表達形式&a…

code iban 是有什么組成_深入淺出Zookeeper(四):客戶端的請求在服務器中經歷了什么...

作者 泊浮目 沃趣科技高級研發工程師出品 沃趣科技1. 前言當我們向zk發出一個數據更新請求時,這個請求的處理流程是什么樣的?zk又是使用了什么共識算法來保證一致性呢?帶著這些問題,我們進入今天的正文。2. 設計模式&#xff1…

Centos7: 配置IO調度

今天有同事問我個問題:“CentOS7如何修改IO默認的調度”,我這里簡單整理下如何調整的方法: 1、查看CentOS7下IO支持的調度 1234[rootkvm02 ~]# dmesg | grep -i scheduler [ 16.900459] io scheduler noop registered[ 16.900473] io sch…