javascript - How to pass parameters from sub-component to parent component in Vue

Question

• Background: Vue ES6, the child component is called after the parent component is created, and the event trigger onclick has been encapsulated in the underlying component (the child component of the child component)

• Question: How does a child component pass parameters to the parent component when there is no event binding in the parent component?

Answer 1

1. EventBus (a situation without event binding that does not quite meet the requirements of the question)

2. Vuex

Answer 2

dispatch

Answer 3

Father-child component communication

Answer 4

$emit()

Answer 5

The child component uses v-on to listen to an event, and then when it is triggered, it sends the event, which is $emit. Then the parent component also uses v-on to listen to the event you send, and then executes the event defined by your parent component.

Answer 6

The person above has made it clear, I’m here to make up for it
child.vue

<template>
    <p id="test">向父传递</p>
</template>
<script>
    export default {
        methods: {
            $('#test').click(()=>{
                this.$emit('data', '这是我要传的参数');
            })
        }
    }
</script>

parent.vue

<template>
    <child @data="fnSS"></child>
</template>
<script>
    import child from './child';
    export default {
        components: {
            tagInput
        }
        methods: {
            fnSS(value) {
                alert(value);
            },
        }
    }
</script>

Answer 7

$emit()

Answer 8

Subcomponent this.$emit("event",data)

Parent component @event