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 相关文章推荐
文字溢出实现溢出的部分再放入一个新生成的div中具体代码
May 17 Javascript
JS获取计算机mac地址以及IP的实现方法
Jan 08 Javascript
jQuery Dialog对话框事件用法实例分析
May 10 Javascript
最原始的jQuery注册验证方式
Oct 11 Javascript
JS经典正则表达式笔试题汇总
Dec 15 Javascript
JS常用倒计时代码实例总结
Feb 07 Javascript
JavaScript中最常见的三个面试题解析
Mar 04 Javascript
利用js定义一个导航条菜单
Mar 14 Javascript
webpack使用 babel-loader 转换 ES6代码示例
Aug 21 Javascript
vue 实现在函数中触发路由跳转的示例
Sep 01 Javascript
使用vue.js在页面内组件监听scroll事件的方法
Sep 11 Javascript
基于Vue+ElementUI的省市区地址选择通用组件
Nov 20 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
PHP 木马攻击防御技巧
2009/06/13 PHP
php小型企业库存管理系统的设计与实现代码
2011/05/16 PHP
php常用图片处理类
2016/03/16 PHP
php 7新特性之类型申明详解
2017/06/06 PHP
Laravel框架实现的上传图片到七牛功能详解
2019/09/06 PHP
laravel5.5安装jwt-auth 生成token令牌的示例
2019/10/24 PHP
获取div编辑框,textarea,input text的光标位置 兼容IE,FF和Chrome的方法介绍
2012/11/08 Javascript
微信小程序(三):网络请求
2017/01/13 Javascript
javascript 面向对象function详解及实例代码
2017/02/28 Javascript
vue2.0基于vue-cli+element-ui制作树形treeTable
2019/04/30 Javascript
vue实现输入框的模糊查询的示例代码(节流函数的应用场景)
2019/09/01 Javascript
微信小程序中插入激励视频广告并获取收益(实例代码)
2019/12/06 Javascript
微信小程序中的上拉、下拉菜单功能
2020/03/13 Javascript
微信小程序实现拼图小游戏
2020/10/22 Javascript
[40:29]2018DOTA2亚洲邀请赛 4.7总决赛 LGD vs Mineski 第一场
2018/04/10 DOTA
[02:44]重置世界,颠覆未来——DOTA2 7.23版本震撼上线
2019/12/01 DOTA
Python中捕捉详细异常信息的代码示例
2014/09/18 Python
使用Python的Zato发送AMQP消息的教程
2015/04/16 Python
Python Socket实现简单TCP Server/client功能示例
2017/08/05 Python
恢复百度云盘本地误删的文件脚本(简单方法)
2017/10/21 Python
Python3.6笔记之将程序运行结果输出到文件的方法
2018/04/22 Python
Python利用splinter实现浏览器自动化操作方法
2018/05/11 Python
Python产生Gnuplot绘图数据的方法
2018/11/09 Python
如何基于python生成list的所有的子集
2019/11/11 Python
离线状态下在jupyter notebook中使用plotly实例
2020/04/24 Python
python os.rename实例用法详解
2020/12/06 Python
匡威比利时官网:Converse Belgium
2017/04/13 全球购物
Speedo速比涛法国官方网站:泳衣、泳镜、泳帽、泳裤
2019/07/30 全球购物
PHP经典面试题
2016/09/03 面试题
十八届三中全会学习方案
2014/02/16 职场文书
暑期社会实践心得体会
2014/09/02 职场文书
学生意外伤害赔偿协议书
2014/09/17 职场文书
1000字打架检讨书
2014/11/03 职场文书
毕业论文致谢信
2015/05/14 职场文书
2015年大学迎新晚会总结
2015/07/16 职场文书
golang生成并解析JSON
2022/04/14 Golang