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 valueOf 使用方法
Dec 28 Javascript
jQuery提交表单ajax查询实例代码
Oct 07 Javascript
js Calender控件使用详解
Jan 05 Javascript
jQuery实现图片文字淡入淡出效果
Dec 21 Javascript
Angularjs全局变量被作用域监听的正确姿势
Feb 06 Javascript
Bootstrap3.0建站教程(一)之bootstrap表单元素排版
Jun 01 Javascript
用纯Node.JS弹出Windows系统消息提示框实例(MessageBox)
May 17 Javascript
基于vue cli重构多页面脚手架过程详解
Jan 23 Javascript
微信小程序下拉菜单效果的实例代码
May 14 Javascript
关于element-ui的隐藏组件el-scrollbar的使用
May 29 Javascript
js对象简介与基本用法示例
Mar 13 Javascript
详细分析vue响应式原理
Jun 22 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/10/09 PHP
PHP实现多条件查询实例代码
2010/07/17 PHP
使用php测试硬盘写入速度示例
2014/01/27 PHP
php操作(删除,提取,增加)zip文件方法详解
2015/03/12 PHP
php用户登录之cookie信息安全分析
2016/05/13 PHP
laravel 关联关系遍历数组的例子
2019/10/10 PHP
用Javascript读取中文COOKIE的解决办法
2007/02/15 Javascript
动态标签 悬停效果 延迟加载示例代码
2013/11/21 Javascript
javascript中的altKey 和 Event属性大全
2015/11/06 Javascript
浅谈toLowerCase和toLocaleLowerCase的区别
2016/08/15 Javascript
jQuery焦点图轮播效果实现方法
2016/12/19 Javascript
JS中如何实现点击a标签返回页面顶部的问题
2017/01/19 Javascript
详解Vue中添加过渡效果
2017/03/20 Javascript
微信小程序实现动态获取元素宽高的方法分析
2018/12/10 Javascript
ES6小技巧之代替lodash
2019/06/07 Javascript
python开发的小球完全弹性碰撞游戏代码
2013/10/15 Python
Python 正则表达式的高级用法
2016/12/04 Python
详解python调度框架APScheduler使用
2017/03/28 Python
python实现图片处理和特征提取详解
2017/11/13 Python
Python 实现两个服务器之间文件的上传方法
2019/02/13 Python
python时间序列按频率生成日期的方法
2019/05/14 Python
Django如何开发简单的查询接口详解
2019/05/17 Python
window环境pip切换国内源(pip安装异常缓慢的问题)
2019/12/31 Python
Pandas将列表(List)转换为数据框(Dataframe)
2020/04/24 Python
美国网上花店:JustFlowers
2017/02/12 全球购物
可打印的优惠券、杂货和优惠券代码:Coupons.com
2018/06/12 全球购物
婴儿地球:Baby Earth
2018/12/25 全球购物
Genny意大利官网:意大利高级时装品牌
2020/04/15 全球购物
租房合同协议书
2014/04/09 职场文书
学雷锋先进个人事迹
2014/05/26 职场文书
幼儿园迎国庆65周年活动策划方案
2014/09/16 职场文书
奥巴马开学演讲观后感
2015/06/12 职场文书
学校团代会开幕词
2016/03/04 职场文书
800字作文之大雪
2019/12/04 职场文书
Python 可迭代对象 iterable的具体使用
2021/08/07 Python
python模拟浏览器 使用selenium进入好友QQ空间并留言
2022/04/12 Python