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 相关文章推荐
Javascript select控件操作大全(新增、修改、删除、选中、清空、判断存在等)
Dec 19 Javascript
javascript 放大镜 v1.0 基于Yui2 实现的放大镜效果
Mar 08 Javascript
由ReactJS的Hello world说开来
Jul 02 Javascript
jQuery使用模式窗口实现在主页面和子页面中互相传值的方法
Mar 01 Javascript
JS实现的加减乘除四则运算计算器示例
Aug 09 Javascript
JavaScript实现简单评论功能
Aug 17 Javascript
Angular2+国际化方案(ngx-translate)的示例代码
Aug 23 Javascript
HTML5开发Kinect体感游戏的实例应用
Sep 18 Javascript
jquery动态添加带有样式的HTML标签元素方法
Feb 24 jQuery
JS实现图片转换成base64的各种应用场景实例分析
Jun 22 Javascript
Bootstrap开发中Tab标签页切换图表显示问题的解决方法
Jul 13 Javascript
JS实现面向对象继承的5种方式分析
Jul 21 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 采集书并合成txt格式的实现代码
2009/03/01 PHP
PHP 面向对象详解
2012/09/13 PHP
php构造函数实例讲解
2013/11/13 PHP
php 生成自动创建文件夹并上传文件的示例代码
2014/03/07 PHP
smarty半小时快速上手入门教程
2014/10/27 PHP
php实现URL加密解密的方法
2016/11/17 PHP
PHP基于简单递归函数求一个数阶乘的方法示例
2017/04/26 PHP
PHP实现的下载远程文件类定义与用法示例
2017/07/05 PHP
你可能不再需要JQUERY
2021/03/09 Javascript
跨浏览器的 mouseenter mouseleave 以及 compareDocumentPosition的使用说明
2010/05/04 Javascript
jquery 获取表单元素里面的值示例代码
2013/07/28 Javascript
常用的JavaScript验证正则表达式汇总
2013/11/26 Javascript
js实现搜索框关键字智能匹配代码
2020/03/26 Javascript
jQuery使用cookie与json简单实现购物车功能
2016/04/15 Javascript
JQuery 的跨域方法推荐_可跨任何网站
2016/05/18 Javascript
使用jQuery加载html页面到指定的div实现方法
2016/07/13 Javascript
Node.js读写文件之批量替换图片的实现方法
2016/09/07 Javascript
javascript特殊文本输入框网页特效
2016/09/13 Javascript
jquery实现静态搜索功能(可输入搜索文字)
2017/03/28 jQuery
Vue.js中的图片引用路径的方式
2017/07/28 Javascript
Angularjs Promise实例详解
2018/03/15 Javascript
vue 2.8.2版本配置刚进入时候的默认页面方法
2018/09/21 Javascript
解决antd的Form组件setFieldsValue的警告问题
2020/10/29 Javascript
详解如何使用Python编写vim插件
2017/11/28 Python
基于Django与ajax之间的json传输方法
2018/05/29 Python
Python实现拷贝/删除文件夹的方法详解
2018/08/29 Python
pandas DataFrame运算的实现
2020/06/14 Python
如何使用python记录室友的抖音在线时间
2020/06/29 Python
Beach Bunny Swimwear官网:设计师泳装和性感比基尼
2019/03/13 全球购物
巴西箱包、背包、钱包和旅行配件购物网站:Inovathi
2019/12/14 全球购物
计算机大学生职业生涯规划书范文
2014/02/19 职场文书
校园歌咏比赛主持词
2014/03/18 职场文书
感恩祖国演讲稿
2014/09/09 职场文书
2019银行员工个人工作自我鉴定
2019/06/27 职场文书
导游词之晋城蟒河
2019/12/12 职场文书
详解SQL的窗口函数
2022/04/21 Oracle