vue系列文章（14）vue-cli脚手架，组件嵌套，全局组件注册和局部组件注册

首先新建我们自定义组件Users组件，并在组件中加入我们自己的内容，如下所示，自定义Users组件，并对users进行循环输出。

 

那么我们如何在App.vue中将我们Users组件进行展示出来的呢，需要将Users组件进行注册，下面有两种注册方式。第一种是全局组件注册，如下在main.js

 

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import Users from './components/Users'

Vue.config.productionTip = false

// 全局注册组件
Vue.component("users",Users)

/* eslint-disable no-new */
new Vue({
  el: '#app',
  components: { App },
  template: ''
})

那么我们就可以在App.vue中直接引入users组件了

 

全局组件平时使用的频率并不多，大多数都是局部组件，下面是第二种局部注册组件。

 

   Vue系列文章目录 

1. vue系列文章（1）：对象绑定，属性绑定
2. Vue系列文章（2）事件绑定，鼠标点击事件
3. vue系列文章（3）：事件修饰符
4. Vue系列文章（4）键盘事件及键盘修饰符
5. vue系列文章（5）双向数据绑定
6. vue系列文章（6）计算属性computed
7. vue系列文章（7）动态CSS类型绑定
8. vue系列文章（8）条件渲染
9. vue系列文章（9）v-for条件循环
10. vue系列文章（10）vue实战项目demo
11. vue系列文章(11)：初始化多个实例对象
12. vue系列文章（12）初始组件的应用
13. Vue系列文章（13）vue cli脚手架
14. vue系列文章（14）vue-cli脚手架，组件嵌套，全局组件注册和局部组件注册
15. vue系列文章（15）属性传值props
16. vue系列文章（16）传值和传引用的类型和区别
17. vue系列文章（17）利用事件传递将子组件值传递给父组件
18. vue系列文章（18）vue生命周期
19. vue系列文章（19）vue路由配置
20. vue系列文章（20） vue网络请求vue-resource

 如果上面文章对你有用，打赏下我吧@*@