VueJs探索之watch用法詳解
Vue.js 提供了一個方法 watch,它用於觀察Vue例項上的資料變動。對應一個物件,鍵是觀察表示式,值是對應回撥。值也可以是方法名,或者是物件,包含選項。具體的用法可以直接看下面的示例,簡單直接。
<div id="app">
<input type="text" v-model:value="childrens.name" />
<input type="text" v-model:value="lastName" />
</div>
<script type="text/javascript">
var vm = new Vue( {
el: '#app',
data: {
childrens: {
name: '小強',
age: 20,
sex: '男'
},
tdArray:["1","2"],
lastName:"張三"
},
watch:{
childrens:{
handler:function(val,oldval){
console.log(val.name)
},
deep:true//物件內部的屬性監聽,也叫深度監聽
},
'childrens.name':function(val,oldval){
console.log(val+"aaa")
},//鍵路徑必須加上引號
lastName:function(val,oldval){
console.log(this.lastName)
}
},//以V-model繫結資料時使用的資料變化監測
} );
vm.$watch("lastName",function(val,oldval){
console.log(val)
})//主動呼叫$watch方法來進行資料監測
</script>
</body>
注意:陣列的改變不需要使用深度watch。相關推薦
VueJs探索之watch用法詳解
Vue.js 提供了一個方法 watch,它用於觀察Vue例項上的資料變動。對應一個物件,鍵是觀察表示式,值是對應回撥。值也可以是方法名,或者是物件,包含選項。具體的用法可以直接看下面的示例,簡單直接。 <div id="app"> <input
(轉)Linux命令之Ethtool用法詳解
如果 size ram phy 基本設置 速度 終端 網卡驅動 sed Linux命令之Ethtool用法詳解 原文:http://www.linuxidc.com/Linux/2012-01/52669.htm Linux/Unix命令之Ethtool描述:Eth
1.12-linux三劍客之awk用法詳解
-a proc == 行號 oss url oldboyedu rap oai 1.12linux三劍客之awk用法詳解內容:1. awk執行過程2. awk命令格式3. awk用法4. awk數組第1章 awk執行過程 一直讀取到文件的最後一行第2章 awk ‘找誰{幹啥
ionic3之tabs用法詳解
[root] Page 指定tab希望載入的頁面 tabTitle string tab上顯示的標題 tabIcon string tab上顯示的圖示 tabBadge string tab上顯示的角標數
NIO程式設計之ServerSocketChannel用法詳解
之前一直看不懂NIO中的ServerSocketChannel和SocketChannel的區別,看了這篇博文,感覺通俗易懂,於是決定分享一下。。。。 在用nio通訊的過程我用以下情景給你模擬: 學校(ServerSocketChannel) 2。 學校教務處
Android之viewstub用法詳解及實現延遲載入
上一篇的佈局中間就用了viewstub這個控制元件,現在來說一下其作用和用法" ViewStub 是一個不可見的,大小為0的View,最佳用途就是實現View的延遲載入,避免資源浪費,在需要的時候才載入View"需要注意的是,載入view之後,viewstub本身就會被新載入
Android之ButterKnife用法詳解
轉自:http://blog.csdn.net/leavessilent/article/details/60872096 相信很多開發Android的小夥伴,都厭倦了findViewById(),都是基本重複的操作,所以我們可以使用依賴注入框架來偷懶。目前,用的較多的
C語言之#include用法詳解
學習Linux C,必須要理解include,只要弄清以下幾個問題,就能完全理解include了! 1.#include 實質是什麼? 預編譯的時候copy include標頭檔案的內容到當前行 (疑問:預編譯命令 $gcc -E test.c -o test.i) 2.
Android Animation之ScaleAnimation用法詳解
ScaleAnimation用法詳解ScaleAnimation是Animation的子類,其有四個構造方法:1、publicScaleAnimation(Context context, AttributeSet attrs)方法的兩個引數中context就不再解釋了,上下
SVN之Cornerstone用法詳解 與解決上傳.a檔案用法
1.在Launchpad中選擇Conerstone檔案 (圖1) 2.出現如下檢視 (圖2) 3.在伺服器目錄區域,點選“+”,新增HTTP Server。 (圖3) 4.選中所新
dos命令之 chcp 用法詳解(修改dos視窗的編碼表(內碼表))
小提示:在dos下輸入help可以檢視支援的命令列表,某個命令的詳細用法可以用 help 命令名 或 命令名 /? 來檢視。 chcp 顯示或設定活動內碼表數。 用法:CHCP [nnn] n
swift之UILabel用法詳解
//1.建立 let label=UILabel(frame:CGRect(origin:CGPoint(x:100,y:100),size:CGSize(width:200,height:10
struts2基礎探索之OGNL表示式詳解
OGNL概述: OGNL是一種可以吧UI元素(如table和input等基礎元素)和model object(模型物件)繫結的語言,且通過OGNL的TypeConverter機制可以更容易實現值型別的轉換 .在struts2中使用OGNL表示式實際上是使用實
boost::algorithm用法詳解之字符串關系判斷
ret 判斷 hello 第一個字符 pri 字符串替換 views .net private http://blog.csdn.net/qingzai_/article/details/44417937 下面先列舉幾個常用的: #define i_end_with boo
linux進程間通信之Posix共享內存用法詳解及代碼舉例
函數 ini 復制代碼 define 進程 a.out IV 使用 init Posix共享內存有兩種非親緣進程間的共享內存方法:1). 使用內存映射文件,由open函數打開,再由mmap函數把返回的文件描述符映射到當前進程空間中的一個文件。2). 使用共享內存區對象,由
linux進程間通信之Posix 信號量用法詳解代碼舉例
lee lag tar 不同 sem_init sign 基於內存 target PC Posix信號量不同於System V信號量的信號量集,Posix信號量是單一的信號量,分為有名信號量和無名信號量。Posix有名信號量是使用Posix IPC名字標示的信號量,可用於進
@RequestMapping 用法詳解之地址映射(轉)
iso 圖片 turn ID 分享圖片 sym lar binding att 引言: 前段時間項目中用到了RESTful模式來開發程序,但是當用POST、PUT模式提交數據時,發現服務器端接受不到提交的數據(服務器端參數綁定沒有加任何註解),查看了提交方式為applic
C# 之 static的用法詳解
c const 一次 訪問 分配 focus rgs 改變 class 數據 一、靜態類 靜態類與非靜態類的重要區別在於靜態類不能實例化,也就是說,不能使用 new 關鍵字創建靜態類類型的變量。在聲明一個類時使用static關鍵字,具有兩個方面的意義:首先,它防止程序員
JAVA常用集合框架用法詳解基礎篇一之Colletion介面
首先,在學習集合之前我們能夠使用的可以儲存多個元素的容器就是陣列。 下面舉幾個例子主要是引出集合類的: 1、8,4,5,6,7,55,7,8 像這樣的型別相同的可以使用陣列來儲存,本例可以用int[] arr來儲存。 2、”zhnagsan”,true,68 像這樣的可以使
JAVA常用集合框架用法詳解基礎篇三之Colletion子介面Set
這一篇我們來介紹Collection介面的另一個子介面,Set介面。Set是個介面,元素不可以重複,是無序的。Set介面中的方法和Collection的一致。 A、Set的子類: 1、HashSet:此類實現的Set介面,由雜湊表(實際上是一個HashMap)例項支援,它不保證Set的迭代順