vue原理實現
阿新 • • 發佈：2017-08-23
text pwd use document java spa 雙向數據綁定 itl log
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>vue雙向數據綁定原理和模擬</title> </head> <body> <input type="text" id="userName"> <br> <span id="uName"></span> </body> </html> <script type="text/javascript"> var obj = { pwd:"123456" } Object.defineProperty(obj,"userName",{ get:function() { console.log(‘get init‘) }, set:function(val){ console.log(‘set init‘) document.getElementById("uName").innerText =val; document.getElementById("userName").value = val; } }) document.getElementById("userName").addEventListener("keyup",function(event){ obj.userName = event.target.value; }) </script>
vue兩大特征
數據驅動
組件化
vue原理實現