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.
38 lines
857 B
38 lines
857 B
<template> |
|
<!-- 3. 添加自定义事件selected --> |
|
<ChildComponentA title="list—data" :list_data="todos" @selected="onSelected"></ChildComponentA> |
|
<div> |
|
<h3>您选中了{{ selected_status }}</h3> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
import ChildComponentA from "@/components/ChildComponentA.vue"; |
|
|
|
export default { |
|
components: {ChildComponentA}, |
|
data() { |
|
return { |
|
todos: [ |
|
'todo-1', |
|
'todo-2', |
|
'todo-3', |
|
'todo-4', |
|
'todo-5' |
|
], |
|
// 1. 定义一个变量,用于接收子组件中回传的数据 |
|
selected_status: '' |
|
} |
|
}, |
|
methods: { |
|
// 2. 创建一个方法处理接收到的数据,映射到本地,同时在使用子组件标签时进行事件绑定 |
|
onSelected(item) { |
|
this.selected_status = item; |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style scoped> |
|
|
|
</style>
|
|
|