2019-05-10
[vue]子组件通过$emit调用父组件的方法以及传递数据给父组件
原理也很简单,子组件使用$emit来触发父组件的函数,子组件借助这个父组件的函数将数据传给父组件。
父组件中方法:
<template> <div>{ {ChildData}}</div> <router-view @pushData="getChildData"></router-view> </template> <script> export default { data:function(){ return{ ChildData:"",//定义获取子组件的数据 } }, methods:{ getChildData (data) { this.ChildData=data//想要获取子组件的数据,并赋值给自己的ChildData } } } </script>
子组件的数据,并且调用父组件函数来传值:
<template> <div @click="sendYourData">点我将数据传给父组件</div> </template>