.vue文件的解析

在项目中，vue文件可以看为一个小组件。

<template>
<!-- 
    这里编写模板 html  
    template里边只允许放一个元素，如果写多个元素，可以用一个div包裹起来
    编写自己的dom
    和引入的组件<home>
-->
  <div>
     <div>当前文件的dom</div>
     <home></home>
  </div>
</template>

<script>
// 这里编写逻辑 js
// 引入组件Home，从home.vue。将其它模板引入到当前文件中
import Home from './test/home'
//  导出组件 
export default{
// 导出当前组件的名字
   name:'Hello',
// 引入子组件的名字
   components: {
      Home
   }
}
</script>

<style scoped>
<!--
   这里编写样式 css
   scoped 是为了防止本文件的样式，被其它文件使用
-->
</style>