版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_24767091/article/details/82593047
一、组件划分
1.功能模块---select,pagenation...
2.页面区域---header, footer, sidebar...
二、引用组件
举例在App.vue中引用header.vue和footer.vue组件
1.用import引入
2.用components:[ Header, Footer ]引入 注册组件
3.引用模板
三、组件之间的通信
1.父组件向子组件传值
在app.vue中引入header.vue组件,从app.vue中向header组件传值msg,则在header.vue中用props注册一下msg属性,来接收传过来的值
2.子组件向父组件传值用事件
方法一:$emit()
ex:子组件componentA向父组件App.vue传值
1.在父组件中引入子组件
2.父组件中使用组件:在组件中绑定接受子组件传值事件listenToMyBoy将子组件的值传递到{{ childWords }}中
3.父组件中listenToMyBoy方法
4.子组件中点击事件向父组件传值
5.子组件中使用$emit()传值
四、效果