记录一下命名的的一些坑

引入文件时, 默认第一个字母大写

import Vue from 'vue'

1. 组件命名的大小写

组件名大小写
定义组件名的方式有两种:

使用 kebab-case

Vue.component('my-component-name', { /* ... */ })

当使用 kebab-case (短横线分隔命名) 定义一个组件时,
必须在引用这个自定义元素时使用 kebab-case,例如<my-component-name>。

使用 PascalCase

Vue.component('MyComponentName', { /* ... */ })

两者均可
当使用 PascalCase (首字母大写命名) 定义一个组件时,你在引用这个自定义元素时两种命名法都可以使用。也就是说 和 都是可接受的。注意,尽管如此,直接在 DOM (即非字符串的模板) 中使用时只有 kebab-case 是有效的。

2. prop命名的大小写

HTML 中的特性名是大小写不敏感的,
所以浏览器会把所有大写字符解释为小写字符。这意味着当你使用 DOM 中的模板时,camelCase (驼峰命名法) 的 prop 名需要使用其等价的 kebab-case (短横线分隔命名) 命名:

Vue.component('blog-post', {// 在 JavaScript 中是 camelCase 的props: ['postTitle'],template: '<h3>{{ postTitle }}</h3>'
})
<!-- 在 HTML 中是 kebab-case 的 -->
<blog-post post-title="hello!"></blog-post>

重申一次,如果你使用字符串模板,那么这个限制就不存在了。

3. 自定义事件的大小写

不同于组件和 prop,事件名不会被用作一个 JavaScript 变量名或属性名,
所以就没有理由使用 camelCase 或 PascalCase 了。并且 v-on 事件监听器在 DOM 模板中会被自动转换为全小写 (因为 HTML 是大小写不敏感的),
所以 v-on:myEvent 将会变成 v-on:myevent——导致 myEvent 不可能被监听到。

因此,我们推荐你始终使用 kebab-case 的事件名

禁止使用驼峰命名, 直接使用中划线即可

vue 有关于命名大小写的问题相关推荐

  1. Vue组件的命名规则

    Vue组件的命名规则 什么是组件? 可以组合的物件就叫组件,比如手臂.腿就是人的组件. 组件可以认为是实例中的实例. camelCased (驼峰式) 命名与kebab­Case (短横线) 命名 1 ...

  2. 警惕cocos2d-x Win32下资源命名大小写

    cocos2d-x Win32下资源命名大小写无所谓,这一点你从众多的网络代码中可以轻松得知,但是,当你把它们移植到ANDROID时,问题出现了.当然,缺乏的资源可以轻松地从ECLIPSE下LOG窗口 ...

  3. 对话屏幕Dynpro(SE51) 屏幕元素 屏幕属性 PAI事件的触发、屏幕元素Function Code设置 屏幕流逻辑Screen Flow Logic 对话屏幕中的字段命名大小写问题

    对话屏幕Dynpro(SE51) 屏幕元素 屏幕属性 l  屏幕序号(Screen number).四个数字组成的序列号,用于在程序中确定屏幕,该序号在同一个ABAP程序内部是唯一的. l  屏幕类型 ...

  4. vue router name命名规范_vue-router使用

    vue-router基本用法 vue-router的实现原理: 路由不同的页面也就是加载不同的组件. 路由的三个基本概念: router:它是一条路由,test按钮 => test内容,这是一条 ...

  5. vue router name命名规范_超完整的Vue入门指导

    脚本之家 你与百万开发者在一起 作者 | kiba518出品 | 脚本之家(ID:jb51net)前言 新建项目近些年前端开发快速发展,现在学习前端已经不像以前那样仅仅学习一个语法就可以了,它已经是一 ...

  6. TP5 控制器命名大小写问题

    默认情况下,URL是不区分大小写的,也就是说 URL里面的模块/控制器/操作名会自动转换为小写,控制器在最后调用的时候会转换为驼峰法处理. 例如: http://localhost/index.php ...

  7. Vue最全项目命名规范

    Vue最全项目规范 一.命名规范 1.1 项目文件命名 1.1.1 项目名 1.1.2 目录名 1.1.3 图像文件名 1.1.4 HTML 文件名 1.1.5 CSS 文件名 1.1.6 JavaS ...

  8. vue组件一直注册不了_Vue注册组件命名时不能用大写的原因浅析

    这段时间一直在弄vue,当然也遇到很多问题,这里就来跟大家分享一些注册自定义模板组件的心得. 首先"VUE注册组件命名时不能用大写"其实这句话是不对的,但我们很多人开始都觉得是对的 ...

  9. Vue 面试题 (全)

    vue用的什么web模板引擎? jade模板,后来由于商标原因改成了pug v-model的原理? 数据双向绑定的指令,同步控件输入值到data属性 更新data绑定属性,更新控件的值. view层和 ...

最新文章

  1. π型滤波频率计算_滤波电路的总结
  2. Ubuntu + VirtualBox + windows xp互相访问
  3. mysql5.7.22并行回放_MySQL 5.7并行复制时代
  4. Struts result param详细设置
  5. STL源码剖析---迭代器失效小结
  6. 那些奇奇怪怪的男性用品......
  7. Python Pytest调用fixture之@pytest.mark.usefixtures()、叠加usefixtures、@pytest.fixture(autouse=True)用法详解
  8. java返回fail_Java集合中的fail-fast(快速失败)机制详解
  9. jira服务断电导致索引文件损坏问题解决
  10. 电子货架标签----拣货系统
  11. 使用谷歌、360浏览器的F12功能模拟微信访问网页
  12. 跨境电商:外贸企业做海外社媒营销的优势
  13. 【信息技术学考】2021年深圳市高中学业水平考试卷(解析版)
  14. 2100306-52-1,N-Mal-N-bis(PEG4-acid)一种马来酰亚胺PEG试剂,具有两个末端羧酸和一个马来酰亚胺(Mal)基团
  15. Windows下手把手教Snort的安装与配置教程
  16. [Power]Mockito使用和扩展
  17. Arduino编译Marlin1.1出现 fatal error: U8glib.h: No such file or directory如何解决
  18. 超越 GPT-3,DeepMind 推出新宠 Gato,却被质疑“换汤不换药”?
  19. CISP知识大纲思维导图
  20. 南京大学LAMDA所长周志华:机器学习的现状与未来

热门文章

  1. SCRM---私域快速提升成交百万的快闪群及私聊话术
  2. 项目之动态图片的制作
  3. MySQL 统计各领域数量及其百分比
  4. C语言求Fibonacci数列
  5. 32 --> 详解 OpenWRT系统框架基础软件模块之netifd
  6. MAC地址冲突,怎么解决?
  7. Introduction to the Peer-to-Peer Sockets Project
  8. ssm电商背景下精品茶网站的设计与实现毕业设计-附源码191732
  9. c#代码串口服务器的无线连接,C# 通过串口读取和发送数据
  10. 【眼见为实】数据库并发问题 封锁协议 隔离级别