vue官网中介绍父子组件通讯方式是经过自定义事件,在这里我有一个比较特殊的方法,能够将子组件中的数据传递给父组件,主要思路是在子组件中定义一个方法A,在这个方法中返回return想要传递给父组件的数据,而后在父组件中经过$refs调用子组件的方法A。(未完待续...稍后上代码...)vue
子组件header.vue代码 export default { data() { return { childData:'我是子组件传回来的数据' } }, methods: { returnData: function() { return this.childData } } }
父组件代码 <template> <div id="app"> <v-header ref="headerCom"></v-header> </div> </template> <script> import header from '@/components/header' export default { components: { 'v-header':header }, mounted: function(){ alert(JSON.stringify(this.$refs.headerCom.returnData())); } } </script>
只要父组件加载完毕就会alert子组件传递过来的数据,效果以下app