父子组件及全局组件

父子组件使用

组件实例之间是独立的，有模块作用域。

• 父和子，使用的是父，被用的是子
• 父需要声明子组件，引入子组件对象，声明方式如下

主文件 app.vue 中：
# 第一步，引入sub.vue  <script>中：
	import 子组件对象 from './xxx.vue';  → →   import  SubVue from './sub.vue'
# 第二步，在export default 中加入components对象
     components:{
            组件名:子组件对象
             subVue : SubVue
     }
# 第三步，在template中添加下记第一个参数的标签。 <template> 中：
    <sub-vue> </sub-vue>
# 最后，sub.vue template 中的内容会加入到 app.vue 的 template中去。

全局组件

注册全局组件，（即注册完之后可以通过引用标签引入整个页面）给其他vue文件使用。
# main.js中注册
import NavBar from "./component/common/navBar.vue"
Vue.component("navBar", NavBar);

# 其他.vue 中的template中引用
<nav-bar></nav-bar>

# 如何在父子组件中传递参数变量，使子组件在不同的父组件下显示不同的内容。
// 子组件的 vue 文件中:
// template 中：
<h1 class="mui-title">{{title}}</h1>
//  export default中 ： 声明接收父组件参数
 props : [ "title" ],
// 父组件的 vue 文件中通过属性 title 传递参数给子组件:
<nav-bar title="新闻列表"></nav-bar>

• 全局组件，使用更为方便，不需要声明，直接用
• 在main.js中引入一次，在main.js中使用 vue.component('组件名',组件对象);
• 所有的组件就可以直接通过组件名来使用