Parent component subassembly to pass values
Parent component Home.vue
<template> <div> <h2>{{msg}}</h2> <v-header :title="title" :run="run"></v-header> </div> </template> <script> import Header from "./Header.vue"; export default { name: 'home', data () { return { msg:'Home assembly ' , title: ' First came the value ' } }, Methods: { RUN (Data) { Alert (Data) } }, Components: { ' V-header ' : Header } } </ Script > < style lang = "SCSS" scoped > H2 { Color : Red ; } </ style >
Subassemblies Heather.vue
< Template > < div > < H2 > {{MSG}} </ H2 > < H2 > {{}} title </ H2 > < Button @click = "RUN (Data)" > In performing parent component subassembly to pass over method </ Button > </ div > </ Template > < Script > Export default { name: ' header ' , data () { return { msg:'Head assembly ' , Data: ' parent element method subassembly parameters ' } }, Methods: { }, The props: [ ' title ' , ' RUN ' ], Components: { } } </ Script > < style lang = "SCSS " scoped > H2 { Color : Green ; } </ style >
1. The parent element when referring subassembly dynamic binding properties
2. In the sub-assembly and a data receiving method props pass over from the parent component