1 在vue3.0發布之前 vue2.0利用 object.defineproperty來實現雙向資料繫結原理，vue3.0是利用 proxy這個物件實現的(不了解的可以先去查查這個物件)。 這裡應該不用介紹什麼是雙向吧。
2 先介紹 object.defineproperty
先看html**
type
="text"
id="txt"
onkeyup
="show()"
>
//會把這裡輸入的資料顯示到h1標籤裡面 這裡使用了鍵盤事件
"showtxt"
>
h1>
//按照1 2 3 4 的順序看
1var obj=
;//首先定義乙個空的物件。
object.
defineproperty
(obj,
"name",}
)var tvale=document.
getelementbyid
('txt');
var hvalue=document.
getelementbyid
('showtxt');
2function
show()
3function
shows
(val)
實現資料的雙向繫結原理
//html結構不變
var tvale=document.
getelementbyid
('txt');
var hvalue=document.
getelementbyid
('showtxt');
var obj=
;let proxy=
newproxy
(obj,}}
)function
show()
function
shows
(val)
vue2 0父子元件雙向繫結
父元件 如下。這裡要注意的有 1.父組建使用msg向子元件傳遞資料。2.子附件向父附件傳送 訊息，父元件收到訊息後用abc方法來處理。type text v model msg inputvalue msg v on abc child div template style import child...
vue2 0表單事件的繫結
template div id label for mytxt input text input id mytxt type text v model myvalue myvalue label div template lazy 在預設情況下，v model在每次input事件觸發後將輸入框的值與...
vue2 0和3 0的區別
proxy 物件用於建立乙個物件的 從而實現基本操作的攔截和自定義 如屬性查詢 賦值 列舉 函式呼叫等 vue2.0 var a object.defineproperty a,b 只能獲取到newvalue這個引數 vue3.0 var a var newa newproxy a,可以獲取到tar...