vue的多个单文件组件

一、多个单文件组件

多个组件可以在一起使用，它们的关系可以是：平行的、嵌套包含的
目标：应用两个组件，它们是彼此平行的关系
使用：把组件用import引入、用conmponent注册。

1、注册后引用（全局定义方式）：

<script>
import navbar from './components/Navbar'
import sidebar from './components/Sidebar'
//全局组件
//模块化
import Vue from 'vue'
//注册全局
Vue.component("navbar",navbar)
Vue.component("sidebar",sidebar)
<script>

2.注册不引用（局部定义方式）：

components:{
    navbar:navbar,  //组件名，组件对象
    sidebar:sidebar
  }

3.将组件标签嵌入到要显示的页面。

  <div>
  <navbar></navbar>
  <sidebar></sidebar>
  </div>