故如虹,知恩;故如月,知明
排名
6
文章
6
粉丝
16
评论
8
{{item.articleTitle}}
{{item.blogName}} : {{item.content}}
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2024TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
欢迎加群交流技术

import 引入vue 组件命名规则。vue引入自定义的组件

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

端午节快乐~



其实就是两种方法:

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

<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>

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





欢迎加群讨论技术,群:677373950(满了,可以加,但通过不了),2群:656732739

评价