v-model
指令在表單 <input>
、<textarea>
及 <select>
元素上創建雙向數據綁定。它會根據控件類型自動選取正確的方法來更新元素。盡管有些神奇,但 v-model
本質上不過是語法糖。它負責監聽用戶的輸入事件以更新數據,並對一些極端場景進行一些特殊處理。
其實原理很簡單 只是在輸入框中綁定一個 input 事件 , input 事件在用戶輸入時觸發,觸發時獲取元素的value 值 然后在賦值
簡單的案例
<input type="text" id="ipt1"> <input type="text" id="ipt2"> <script> var ipt1=document.getElementById('ipt1'); var ipt2=document.getElementById('ipt2'); ipt1.addEventListener("input",function(){ ipt2.value=ipt1.value; }) </script>