vue 前端父子组件通信

阅读 98

2022-01-10

假设index.vue为父组件,calender.vue为子组件
1、在index.vue中引入calender.vue

import calender from "./calender.vue";

在接下来就可以在index的布局使用calender组件

<calender></calender>

2、父组件向子组件传递数据,采用数据绑定的方式
假设index.vue向calender.vue传递year变量,变量值等于yearselect
在index.vue中

<calender :year="yearselect"></calender>

在calender.vue中

props: ['year']

即可实现
3、子组件向父组件传递day变量,变量值等于dayselect
在index.vue中

<calender @day=" "></calender>

在calender中

this.$emit('day', dayselect)

精彩评论(0)

0 0 举报