Vue--组件

Posted 2020-11-18 changedman

 

1.Vue是单页面组件化的开发

什么是组件：组件是Vue.js最强大的功能之一。组件可以扩展html元素，封装可重用的代码。在较高层面上，组件是自定义的元素，Vue.js的编译器为它添加特殊功能。在有些情况下，组件也可以是原生HTML元素的形式。

页面是由一个根组件挂载其他组件组成的；

使用组件的步骤：

1.引用组件

import Home from ‘./components/Home.vue‘//注意这个路径一定要写对啊

2.挂载组件

components:{

‘v-home‘:Home

},

3.在模板中使用组件

<template>

<div id="app">

{{msg}}

<hr>

<v-home></v-home>

</div>

</template>

注意：1每个组件都必须被一个根节点包含起来一般用个<div>

2 在组件中的样式要加scoped属性表示局部作用域