vue组件命名和props命名代码详解


Posted in Javascript onSeptember 01, 2019
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
  <div id="app">
    <!-- post-title使用驼峰命名postTitle会报错 blog-post改为blogPost会报错 -->
    <blog-post post-title="hello!"></blog-post>
  </div>



  <script>
    Vue.component('blog-post', { //命名时候可以使用横线
     props: ['postTitle'],         //如果这里使用连接线post-title将报错
     template: '<h3>{{ postTitle }}</h3>'
    })

    new Vue({
      el:"#app",

    })
  </script>

</body>
</html>

总结 props里可使用驼峰命名但不能用横线,如果props使用驼峰 组件上将使用横线

vue组建命名 可以使用驼峰和横线, 如果使用驼峰 组建使用将采用横线使用

以上就是关于vue组件命名和props命名的全部知识点内容,感谢大家的学习和对三水点靠木的支持。

Javascript 相关文章推荐
js利用div背景,做一个竖线的效果。
Nov 22 Javascript
不要小看注释掉的JS 引起的安全问题
Dec 27 Javascript
JQUERY 实现窗口滚动搜索框停靠效果(类似滚动停靠)
Mar 27 Javascript
jQuery性能优化的38个建议
Mar 04 Javascript
AngularJS的一些基本样式初窥
Jul 27 Javascript
JS实现Fisheye效果动感放大菜单代码
Oct 21 Javascript
TypeScript Type Innference(类型判断)
Mar 10 Javascript
JavaScript每天必学之基础知识
Sep 17 Javascript
JavaScript学习笔记整理_简单实现枚举类型,扑克牌应用
Sep 19 Javascript
Vue v2.4中新增的$attrs及$listeners属性使用教程
Jan 08 Javascript
vue注册组件的几种方式总结
Mar 08 Javascript
js实现轮播图效果 z-index实现轮播图
Jan 17 Javascript
Vue-CLI项目中路由传参的方式详解
Sep 01 #Javascript
vue实现输入框的模糊查询的示例代码(节流函数的应用场景)
Sep 01 #Javascript
vue中的v-if和v-show的区别详解
Sep 01 #Javascript
react中Suspense的使用详解
Sep 01 #Javascript
vue 实现微信浮标效果
Sep 01 #Javascript
微信小程序获取位置展示地图并标注信息的实例代码
Sep 01 #Javascript
JS实现可用滑块滑动的缓动图代码
Sep 01 #Javascript
You might like
Apache2中实现多网站域名绑定的实现方法
2011/06/01 PHP
PHP生成静态HTML页面最简单方法示例
2015/04/09 PHP
php三种实现多线程类似的方法
2015/10/30 PHP
PHP面向对象程序设计(OOP)之方法重写(override)操作示例
2018/12/21 PHP
PHP压缩图片功能的介绍
2019/03/21 PHP
用javascript实现点击链接弹出&quot;图片另存为&quot;而不是直接打开
2007/08/15 Javascript
JavaScript基础篇之变量作用域、传值、传址的简单介绍与实例
2013/06/29 Javascript
js打开新窗口方法整理
2014/02/17 Javascript
Node.js中使用socket创建私聊和公聊聊天室
2015/11/19 Javascript
JavaScript仿微信(电话)联系人列表滑动字母索引实例讲解(推荐)
2017/08/16 Javascript
Node.js+jade+mongodb+mongoose实现爬虫分离入库与生成静态文件的方法
2017/09/20 Javascript
解决vue页面DOM操作不生效的问题
2018/03/17 Javascript
jQuery length 和 size()区别总结
2018/04/26 jQuery
详解JS转换数值函数Number()、parseInt()、parseFloat()
2018/08/24 Javascript
vue项目持久化存储数据的实现代码
2018/10/01 Javascript
JavaScript函数的4种调用方法实例分析
2019/03/05 Javascript
Vue利用localStorage本地缓存使页面刷新验证码不清零功能的实现
2020/09/04 Javascript
[08:29]DOTA2每周TOP10 精彩击杀集锦vol.7
2014/06/25 DOTA
[00:35]DOTA2上海特级锦标赛 EG战队宣传片
2016/03/04 DOTA
[01:09:23]KG vs TNC 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
python简单分割文件的方法
2015/07/30 Python
tensorflow实现softma识别MNIST
2018/03/12 Python
django如何连接已存在数据的数据库
2018/08/14 Python
python 猴子补丁(monkey patch)
2019/06/26 Python
使用OpenCV实现仿射变换—旋转功能
2019/08/29 Python
Python面向对象中类(class)的简单理解与用法分析
2020/02/21 Python
Keras: model实现固定部分layer,训练部分layer操作
2020/06/28 Python
如何用Django处理gzip数据流
2021/01/29 Python
伊芙丽官方旗舰店:中国淑女一线品牌
2017/12/01 全球购物
研究生导师推荐信
2014/09/06 职场文书
2014年工程工作总结
2014/11/25 职场文书
2014保险公司内勤工作总结
2014/12/16 职场文书
微信小程序scroll-view不能左右滑动问题的解决方法
2021/07/09 Javascript
golang为什么要统一错误处理
2022/04/03 Golang
webpack介绍使用配置教程详解webpack介绍和使用
2022/06/25 Javascript
js作用域及作用域链工作引擎
2022/07/07 Javascript