vue child to parent component values pass

1, sub-assemblies to pass the parent component values ​​need to go through a trigger event,. $ Emit carried out by value with this, two parameters, the first method is to accept the name of this method in the parent component, the other is of value to the parent component

. 1 <Template>
 2      <div>
 . 3          I component son, I give father: List} {{}
 . 4          <P> <Button @ = the Click " toFather " > Click to the father </ Button> </ P>
 . 5      < / div>
 . 6 </ Template>
 . 7  
. 8 <Script>
 . 9 Export default {
 10      Data () {
 . 11          return {
 12 is              List: " money " 
13 is          }
 14      },
 15      Methods:
{
16         toFather(){
17             //giveValue: transmitted data is a function of binding the specified component to the parent, this.list: parent subassembly to the data transfer assembly 
18 is              the this $ EMIT (. " giveValue " , the this .list)
 . 19          }
 20 is      }
 21 is  }
 22 is  
23 is </ script>

 

2, a method of parent components needed to receive the transmitted callback method subassembly, then the parameter data in the pay their properties

In sub-assemblies tag format @ sub-assembly method = "parent component method"

1 <Template>
 2      <div>
 3         <h1> I am a parent component, to ask his son to take the numbers: <span style = " Color: Orange " > {{NUM}} </ span> </ h1>
 4         <Son giveValue = @ " the getValue " > </ Son>
 . 5      </ div>
 . 6 </ Template>
 . 7  
. 8 <Script>
 . 9 Import Son from  ' ./son ' 
10 Export default {
 . 11      Data () {
 12 is          return {
 13 is              NUM: ''
14         }
15     },
16     components: {
17         Son
18     },
19     methods: {
20         getValue(newValue){
21             this.num = newValue
22         }
23     }
24 }
25 </script>