非单文件组件

 Vue中使用组件的三大步骤：

一、定义组件(创建组件)

//第一步：创建school组件
		const school = Vue.extend({
			template:`
				<div class="demo">
					<h2>学校名称：{{schoolName}}</h2>
					<h2>学校地址：{{address}}</h2>
					<button @click="showName">点我提示学校名</button>	
				</div>
			`,
//组件定义时，一定不要写el配置项，因为最终所有的组件都要被一个vm管理，由vm决定服务于哪个容器。
			data(){
				return {
					schoolName:'hnucm',
					address:'湖南长沙'
				}
			},
			methods: {
				showName(){
					alert(this.schoolName)
				}
			},
		})

二、注册组件

1.全局注册：

//第二步：全局注册组件
		Vue.component('hello',hello)

2.局部注册：

		new Vue({
			el:'#root',
			//第二步：注册组件（局部注册）
			components:{
				school
			}
		})

三、使用组件(写组件标签)

<!-- 准备好一个容器-->
		<div id="root">
			
			<!-- 第三步：编写组件标签 -->
			<school></school>
			
		</div>

Vue组件的嵌套：（在组件里面声明组件）

//定义app组件
		const app = Vue.extend({
			template:`
				<div>	
				
					<school></school>
				</div>
			`,
			components:{
				school
				
			}
		})