10，vue学习笔记 -- 组件

10，vue学习笔记 – 组件

官方学习链接：https://cn.vuejs.org/v2/guide/instance.html#%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F%E5%9B%BE%E7%A4%BA

App.vue 是根组件 一般不改变
挂载组件 – 引入 其他的 other.vue 组件
所有的组件要被根组件包含
//1，引入组件
//2，挂载组件
//3，模板中使用组件

App.vue
<templete>
<div id="app">//所有的元素要被根元素包含
{{msg}}
<!--3,引用组件(其他组件页面的信息被引入此页面的此处)-->
<v-home></v-home>
</div>
</templete>
<script>
//1，引入组件
import Home from './components/Home.vue';
export default{
	data(){
		return{
			msg:' vue'
		}
	}，
	components(){
	//2,挂载组件Home.vue（v-home 组件名不能和html 标签重复）
		 'v-home':Home 
	}，
} 
</script>

scoped 局部作用域

<style lang="scss" scoped> 
</style>