子传父

子组件触发父组件方法(回调)

子组件

// 子组件
<templete>
    <div>
        <div @click="handle('Tom')">我是Tom</div>
        <div @click="handle('Bob')">我是Bob</div>
    </div>
</templete>
<script>
    export default {
        methods: {
            handle(val) {
                this.$emit('callbackFuc', val)
            }
        }
    }
</script>

父组件

// 父组件
<templete>
    <div>
        我选择：{{name}}
        <child @callbackFuc="handle"></child>
    </div>
</templete>
<script>
    import child from './child'
    export default {
        components: {
            child
        },
        data() {
            return {
                name: ''
            }
        },
        methods: {
            handle(val) {
                this.name = val
            }
        }
    }
</script>