.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>
    原文作者:李佳臣
    原文地址: https://segmentfault.com/a/1190000017052042
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞