tnblog
首页
登录

import 引入vue 组件命名规则

223人阅读 2020/6/25 16:34 总访问:273760 评论:4 手机 收藏
分类: 前端

端午节快乐~



其实就是两种方法:

第一种就是完全按照组件的名字去使用

<template>
   <MainLayout>
     <p>我是新闻</p>
   </MainLayout>
</template>

<script>
import MainLayout from '../layouts/Main.vue'

export default {
   components: {
      MainLayout
   }
}
</script>

比如这里引用的组件名是MainLayout上面也用MainLayout作为标签使用。


第二种:就是每个大写字母之间使用-隔开

比如:

<template>
   <Main-Layout>
      <p>我是新闻</p>
   </Main-Layout>
</template>

<script>
import MainLayout from '../layouts/Main.vue'

export default {
   components: {
      MainLayout
   }
}
</script>

为了证明这一点我们可以用两个大写字母命名,而且使用没有什么意义的命名方式:

<template>
    <mym-ain-comp>
       <p>我的新闻</p>
    </mym-ain-comp>
</template>

<script>
import mymAinComp from '../layouts/Main.vue'

export default {
    components: {
       mymAinComp
    }
}
</script>

这里的组件名是叫mymAinComp,引用的地方可以使用<mym-Ain-Comp>

哈哈哈感觉这个规则有点意思





评价
你是我最重要的决定
排名
6
文章
6
粉丝
16
评论
8
{{item.articleTitle}}
{{item.blogName}} : {{item.content}}
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2020TNBLOG.NET