vue使用(三)----------父子组件的使用

父组件和子组件的区分

使用组件者为父，被使用组件者为子

父需要声明子组件，引入子组件对象，声明方式如下

import 子组件对象 form './xxx.vue';

{
   components:{
       组件名：子组件对象
   }
}

全局组件，使用更为方便，不需要声明，直接使用
在main.js中引入一次 声明全局组件：'vue.component（'组件名'，组件对象);'

 

父子组件之间的传信

------父传子
父组件通过子组件的属性将值进行传递
---方式有2种：
+常量：prop1="常量值"
+变量：:prop2="变量名"
子组件需要声明
-根属性props:['prop1','prop2']
-在页面中直接使用{{prop1}}
-在js中应该如何使用prop1？ this.prop1获取

------子传父 $on $emit
父组件通过 new Vue()这样的一个对象，来$on('事件名'，fn(prop1,prop2))
子组件引入同一个vuebus，来$emit('事件名'，prop1，prop2)

转载于:https://www.cnblogs.com/JSWBK/p/7891623.html