Vue common way of passing parameters

First, father and son Components

1.1 from father to son (props)

<! - parent component father.vue ->
<Template>
　　<div>
　　　　<div> Here is the father component </ div>
　　　　<div> which is a parameter to be passed to the parent component subassemblies: {{msg}} < / div>
　　　　<- 1. delivery:! data1 msg dynamic parameter is the parameter name, the name of the custom, the reception parameters subassembly same name
　　　　data2 static parameter parameter name, the name of the custom, the reception parameters subassembly same name ->
　　　　<Child: DATAl = "MSG" DATA2 = "777"> </ Child>
　　</ div>
</ Template>
<Script>
　　Import from Child "./child";
Export default {
　　Data () {
　　　　return {
　　　　　　MSG: "666"
　　　　}
　　},
　　Components: {
　　　　Child
　　}
};
</ Script>
<style scoped> </ style>

<! - subassembly child.vue ->
<Template>
　　<div>
　　　　<div> Here is the child component </ div>
　　　　<- 3. Use:!, This is the parent component parameters received ->
　　　　<div> accepted parent component dynamic parameters: {{DATAl}} </ div>
　　　　<div> acceptable parent element static parameters: {{DATA2}} </ div>
　　　　<div> parent component parameters accepted: {{data}} < / div>
</ div>
</ Template>
<Script>
Export default {
　　　　// 2. reception: props receiving parent component parameters, data2 DATAl and to pass parameter name, with the same name within parent components
　　　　props: [ "data1" , "DATA2"],
　　　　Data () {
　　　　　　return {
　　　　　　　　Data: "default"
　　　　　　};
　　　　}
　　// 3.: this calls directly
　　Mounted () {
　　　　this.data = this.data1;
　　}
};
</script>
<style scoped></style>

 

 To a little note here, the parent component parameters passed if it is required to obtain an assignment in the life cycle, you can not bind mounted, otherwise sub-assembly method in this call does not succeed. Lifecycle order: Father beforeMount-> child beforeCreate ...... sub mounted-> parent mounted

1.2 parent child transmission ($ emit)