You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
25 lines
628 B
25 lines
628 B
3 years ago
|
<template>
|
||
|
|
<label>这是子组件内容：</label>
|
||
|
|
<!-- 3. 使用$emit绑定事件并且回传参数 -->
|
||
|
|
名称：<input type="text" :value="name" @input="$emit('update:name', $event.target.value)"/>
|
||
|
|
标题：<input type="text" :value="title" @input="$emit('update:title', $event.target.value)"/>
|
||
|
|
<p>名称是：{{name}}</p>
|
||
|
|
<p>标题是：{{title}}</p>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
// 1. 子组件定义用于映射父组件数据的变量
|
||
|
|
props: {
|
||
|
|
name: String,
|
||
|
|
title: String,
|
||
|
|
},
|
||
|
|
// 2. 注册自定义事件
|
||
|
|
emits: ['update:name', 'update:title'],
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
|
||
|
|
</style>
|