13.3, father and son Components

Parent component subassembly to pass values

<div id="app">
<mycode></mycode>
</div>
<script>
    var vm=new Vue({
        el:'#app',
        data:{
            msg:'123-父组件中的值'
        },
        components:{
            mycode:{
                template:'<h1>这是一个子组件--{{msg}}</h1>'
            }
        }
    })
</script>

Methods In this way the problem can not be achieved between the traditional values ​​of components, sub-assembly that is in default is not accessible to the parent assembly and methods of data

Implementation

Parent may be used when referring to sub-assembly properties bound form (v-bind), the data in the form required binding properties, is transmitted to the subassembly, the subassembly for use

1. <mycode :parentmsg='msg'></mycode>
2. Create internal sub-assemblies props array, this custom properties into which the array can access

<div id="app">
<mycode :parentmsg="msg"></mycode>
</div>
<script>
    var vm=new Vue({
        el:'#app',
        data:{
            msg:'123-父组件中的值'
        },
        components:{
            mycode:{
                template:'<h1>这是一个子组件--{{parentmsg}}</h1>',
                props:['parentmsg']
            },
        }
    })
</script>

Note: The data in all the props components, are passed to the parent component sub-assemblies. data in the data sub-assembly are customized , for example by ajax subassembly incoming data, data can be put away body

Summary, wanted to pass data to the parent component sub-assembly, required to bind the binding data using the data referenced in the sub-assembly to form Tags subassembly, then the subassembly array props, wherein the attribute name is defined, so subassembly which data can be acquired

1. In reference subassembly binding data to a data binding subassembly
2. In the props array string corresponding to the definition subassembly
3. Such subassembly can use the data of the

The method that the parent component subassembly

1. Parent component sub-assemblies to the method of delivery, use the event binding mechanism
2. @ Func = "show", func method subassembly stored name Show a parent component passed to the sub-assembly method name, note that if a show () indicates the execution result of the process returns to func, but without () is a reference to the method passed to func, that is to say, this place whether or not you need to pass parameters, do not add ()
3. When the sub-assembly may be used to call this. $ Emit ( '') in which the write is passed the name of the method, the second parameter later, the parameters corresponding to the process can pass in need