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 相关文章推荐
关于document.cookie的使用javascript
Apr 11 Javascript
原生javascript和jquery判断浏览器版本等信息
Jul 04 Javascript
在表单提交前进行验证的几种方式整理
Jul 31 Javascript
javascipt匹配单行和多行注释的正则表达式
Nov 20 Javascript
解决checkbox的attr(checked)一直为undefined问题
Jun 16 Javascript
HTML,CSS,JavaScript速查表推荐
Dec 02 Javascript
jQuery Easyui使用(一)之可折叠面板的布局手风琴菜单
Aug 17 Javascript
基于JavaScript实现活动倒计时效果
Apr 20 Javascript
angular中实现控制器之间传递参数的方式
Apr 24 Javascript
Vue-Cli中自定义过滤器的实现代码
Aug 12 Javascript
搭建vue开发环境
Jul 19 Javascript
监听angularJs列表数据是否渲染完毕的方法示例
Nov 07 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
如何使用脚本模仿登陆过程
2006/11/22 PHP
加速XP搜索功能堪比vista
2007/03/22 PHP
php下安装配置fckeditor编辑器的方法
2011/03/02 PHP
php设计模式 Builder(建造者模式)
2011/06/26 PHP
PHP中改变图片的尺寸大小的代码
2011/07/17 PHP
PHP魔术方法的使用示例
2015/06/23 PHP
php使用PDO从数据库表中读取数据的实现方法(必看)
2017/06/02 PHP
PHP读取Excel内的图片(phpspreadsheet和PHPExcel扩展库)
2019/11/19 PHP
PHP http请求超时问题解决方案
2020/11/13 PHP
Javascript学习笔记-详解in运算符
2011/09/13 Javascript
javascript针对DOM的应用分析(二)
2012/04/15 Javascript
使用javascipt---实现二分查找法
2013/04/10 Javascript
浅谈jQuery异步对象(XMLHttpRequest)
2014/11/17 Javascript
javascript实现无法关闭的弹框
2016/11/27 Javascript
JS实现DIV高度自适应窗口示例
2017/02/16 Javascript
vuejs实现折叠面板展开收缩动画效果
2018/09/06 Javascript
原生JS使用Canvas实现拖拽式绘图功能
2019/06/05 Javascript
Vue自定义组件双向绑定实现原理及方法详解
2020/09/03 Javascript
python抓取京东价格分析京东商品价格走势
2014/01/09 Python
Python 数据处理库 pandas 入门教程基本操作
2018/04/19 Python
Python IDLE清空窗口的实例
2018/06/25 Python
Python JSON格式数据的提取和保存的实现
2019/03/22 Python
wxPython实现文本框基础组件
2019/11/18 Python
tensorflow模型保存、加载之变量重命名实例
2020/01/21 Python
python读取mysql数据绘制条形图
2020/03/25 Python
使用matplotlib的pyplot模块绘图的实现示例
2020/07/12 Python
最新PyCharm从安装到PyCharm永久激活再到PyCharm官方中文汉化详细教程
2020/11/17 Python
Pycharm在指定目录下生成文件和删除文件的实现
2020/12/28 Python
BRASTY捷克:购买香水、化妆品、手袋和手表
2017/07/12 全球购物
大学军训通讯稿
2014/01/13 职场文书
2015年团支书工作总结
2015/04/03 职场文书
2015年宣传思想工作总结
2015/05/22 职场文书
法律意见书范文
2015/06/04 职场文书
2016年“5.12”护士节致辞
2015/07/31 职场文书
三严三实学习心得体会(精选N篇)
2016/01/05 职场文书
HTML+CSS实现导航条下拉菜单的示例代码
2021/08/02 HTML / CSS