1. 用Vue.component 全域性註冊兩個元件，一個<father>, 一個<child>

2. 在父元件模板中，可以嵌入子元件 <child>

3. 如何傳值：通過 prop 傳值。父元件和子元件都註冊 prop

   a. 父元件在 外部（html 層面，div 根元素內），通過prop 獲取 根例項的 data 資料  

   b. 子元件在父元件模板中，用porp 繫結獲取父元件的prop資料。因為父元件在外部已經通過prop 獲取了根例項的data 資料，所以子元件通過繫結自己的prop 和父元件的prop，就可以獲取根例項的 data 資料

<div id="div">
     <father :fa="msg" ></father>
</div>

<script>
Vue.component("father",{
	template:`
        <p>這是父元件{{fa}}
             <child :chi="fa"></child>
        </p>`,
	props:['fa']
})

Vue.component("child",{
	template:`
	    <p>這是子元件{{chi}}</p>
      `,
	props:['chi']
})

new Vue({
	el:"#div",
	data: {
		msg:"this is root"
	}
	})
</script>
 

網頁渲染效果