美文网首页
面试题 v-model的双向绑定

面试题 v-model的双向绑定

作者: 饥人谷_小霾 | 来源:发表于2020-10-06 16:49 被阅读0次

    面试题 v-model的双向绑定

    1.解释下v-model的作用,

    原理
    一个组件上的v-model默认会利用名为value的props和名为input的事件,但是像单选框复选框等类型的输入控件可能会将valueattribute用于不同目的,model选项可以用来避免这样冲突

    v-model相当于写两件事情
    1.:value="user.username"
    2.监听组件的事件,获取他的值@input="user.username $event.target.value"这是model等价写法
    model默认input是一个元素,event是一个原生event。绑定value等于一个东西,然后@input让东西等于$event.target.value可以实现绑定一个变量,在变量变化的时候,ui变化。用户改变ui的时候,数据也会变化

    2.v-model是v-bind:valuev-on:input的语法糖

    v-on:input="???"分两种情况
    原生input就是"xxx=$event.target.value"
    自定义组件:"xxx=$event"

    相关文章

      网友评论

          本文标题:面试题 v-model的双向绑定

          本文链接:https://www.haomeiwen.com/subject/nhmtpktx.html