码迷,mamicode.com
首页 > 其他好文 > 详细

VUE v-model事件原理

时间:2018-10-30 19:31:21      阅读:401      评论:0      收藏:0      [点我收藏+]

标签:UNC   type   highlight   get   element   用户   code   function   doc   

 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>

  

 

VUE v-model事件原理

标签:UNC   type   highlight   get   element   用户   code   function   doc   

原文地址:https://www.cnblogs.com/banyuege/p/9878742.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!