veu3通过emit('@update:xxx')的方式直接修改父组件传递的属性值

161 阅读1分钟

在父组件中必须使用 -model:xxx的形式传递属性

// app.vue
<template>
    <MyComponent v-model:title="bookTitle" />
</template>

<!-- MyComponent.vue -->
<script setup>
defineProps(['title'])
defineEmits(['update:title'])
</script>

<template>
  <input
    type="text"
    :value="title"
    @input="$emit('update:title', $event.target.value)" // 更新父组件值
  />
</template>