vue .sync 修饰符和自定义v-model的使用

vue

VUE 是单向数据流

当我们需要对一个 prop 进行“双向绑定”时

  • vue 修饰符.sync

子组件:this.$emit('update:visible', visible), 使用update:my-prop-name 的模式触发事件

父组件:

<components :visible="isVisible" @update:visible="val=>isVisible=val"></components>

//简写

<components :visible.sync="isVisible"></components>

子组件:

this.$emit("update:visible", true);

vue 修饰符.sync的功能是:当一个子组件改变了一个 prop 的值时,这个变化也会同步到父组件中所绑定。


  • 自定义v-model”

父组件:

<components v-model="visible"></components>

子组件:

model:{

prop: "visible",

event: "change",

},

props: {

visible: Boolean

},

methods: {

handelChange(){

this.$emit('change',!this.visible);

}

}

以上是 vue .sync 修饰符和自定义v-model的使用 的全部内容, 来源链接: utcz.com/z/378638.html

回到顶部