Vue3的v-model

322 阅读1分钟

这是 Vue 2 到 Vue 3 的一个大变动

要求: 属性名可以任意,假设为value,那事件名必须为"update:value"

// Switch.vue

export default {
  props:{
      value: Boolean
    },
    setup(props,context) {
      const toggle = ()=>{
        context.emit('update:value',!props.value)
      }
      return {toggle};
    }
  }


<!-- SwitchDemo.vue -->

<Switch :value="y" @update:value="y = $event"/>//可以简写为<Switch v-model:value="y" />

$event的值是emit的第二个参数,emit(事件名,事件参数)