02-子组件传递数据给父组件

步骤：

1 父组件提供一个方法，这个方法是子组件调用的，数据通过该方法的参数拿到
2 将这个方法传递给子组件
3 由子组件触发这个方法，将要传递的数据作为方法的参数传递

相关代码：

<div id="app">
    <h1>{{ msg }}</h1>
    <!-- 2 给子组件传递一个自定义事件getmsg,值是getChildMsg方法 -->
    <child @getmsg="getChildMsg"></child>
</div>
const vm = new Vue({
    el: '#app',
    data:{
        msg: 'vivo'
    },
    // 1 父组件提供一个方法
    methods:{
        getChildMsg(data){
            this.msg = data
        }
    },
    components:{
        child:{
            template: `<div><button @click="fn">传递数据给父组件</button></div> `,
            methods:{
                fn(){
                    // 3 触发父组件传来的方法
                    this.$emit('getmsg', 18)
                }
            }
        }
    }
})
// 点击事件后数据为：18