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>