Implementation code for communication of vue child parent component

I always encountered problems when I used vue to write child-parent component communication! ! !

The child component passes the value to the parent component:

Child component: Pass the value to the parent component through the emit method. Here the upparent is the method to be defined by the parent component.

template:

<div v-on:click="switchViewBtn">Switch view</div>

Defined in data: switchStatus = true;

method:

switchViewBtn(){
let that=this;
this.$emit("parentView",);
},

Parent component: Template:

<div @parentView="changeView" :msg="msg"></div>

method:

changeView(msg){
 = msg;
}

This allows the child component to be passed to the parent component.

The parent component passes the value to the child component:

Parent component: Template:

　<div :name="name">Switch view</div>

Assign values ​​in data:

　export default {
data() {
return {
data：‘zy'
　}
}
}

Accept code in the child component:

export default {
data() {
return {
data：‘zy'
}
}，
props:[
　'name'
]
}

The above is the implementation code of the vue child-parent component communication introduced to you by the editor. I hope it will be helpful to you. If you have any questions, please leave me a message. The editor will reply to you in time!