• .sync和v-model的区别


    v-model双向绑定实现   单向数据流-》 父组件将值传递给子组件,子组件修改值时,将当前值e.target.value传递给父组件,父组件将该值传递给子组件,子组件的值修改

    子组件 kInput.vue

    <input :value="value" @input="onInput" v-bind="$attrs">

    父组件 parent.vue

    <!--      v-model代表着已经将子组件的value传递了过去-->
    <KInput v-model="model.username"></KInput>

    <!-- 和上面作用一样,上面的写法只是一个语法糖-->
    <!-- <KInput :value="model.username" @input="getData"></KInput>-->
    <KInput v-model="model.password" type="password"></KInput>
    V-model等同于:value+@input事件的结合

    sync修饰符添加于v2.4,类似于v-model,他能用于修改传递到子组件的属性
    <Input :value.sync="username">等同于
    <Input :value="username" @updata:value="usernaem=$event">
    这里绑定的属性名称更改,相应的属性名也会变化
    <Input :foo="username" @updata:foo="usernaem=$event">
    用于场景:父组件传递的属性子组件想修改
    sync修饰符的控制能力都在父级,事件名称也相对固定update:xx

     


  • 相关阅读:
    高精度A+B
    基本定积分求面积
    二进制算子集和
    linux命令
    Dubbo
    java 集合区别
    Java中Comparable和Comparator区别
    synchronized实现原理
    ThreadLocal 原理
    java volatile关键字
  • 原文地址:https://www.cnblogs.com/cazj/p/12522157.html
Copyright © 2020-2023  润新知