Vue中的v-model

一、v-model的使用场景

     针对与form表单的input,select,radion,checkbox等一些表单控件

二、Vue使用v-model实现双向绑定

     v-model其实是Vue中一个语法糖,在表单使用v-mode时,vue底层会解析html标签,解析是否含有v-model的指令,如果有,并将对应的属性挂载到vue中,并且给这个表单添加input,change事件,当改变表单中的值时,相应的也会出发绑定的事件。同理就实现了双向绑定。

三、为什么子元素不能改变父元素的v-mode的值

      为了能够准确的定位数据的错误位置,如果子元素能够修改父元素的值,那么存在多个子元素时,修改父元素的值,那么就无法定位到那个元素的使用错误。所以只能通过父级本身去修改自己的值。

      底层的实现原理:vue实现子元素不能修改父元素的值,其实通过一个flag的标记位,判断是谁修改父元素的值。可以翻阅源码。

    如何修改父元素的值:$eimt,v-model.sync

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值