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 相关文章推荐
phpwind放自动注册方法
Dec 02 Javascript
JQuery 中几个类选择器的简单使用介绍
Mar 14 Javascript
关于javascript event flow 的一个bug详解
Sep 17 Javascript
js获取UserControl内容为拼html时提供方便
Nov 02 Javascript
JS实现兼容各种浏览器的获取选择文本的方法【测试可用】
Jun 21 Javascript
JavaScript队列、优先队列与循环队列
Nov 14 Javascript
Vue获取DOM元素样式和样式更改示例
Mar 07 Javascript
浅谈jquery中ajax跨域提交的时候会有2次请求的问题
Nov 10 jQuery
详解在React-Native中持久化redux数据
May 22 Javascript
简单实现节流函数和防抖函数过程解析
Oct 08 Javascript
vue element自定义表单验证请求后端接口验证
Dec 11 Javascript
Vue2.4+新增属性.sync、$attrs、$listeners的具体使用
Mar 08 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取整的几种方式
2013/06/25 PHP
PHP整数取余返回负数的相关解决方法
2014/05/15 PHP
递归实现php数组转xml的代码分享
2015/05/14 PHP
利用PHP内置SERVER开启web服务(本地开发使用)
2020/01/22 PHP
Yii Framework框架开发微信公众平台示例
2020/04/26 PHP
页面中iframe相互传值传参
2009/12/13 Javascript
基于jquery的获取浏览器窗口大小的代码
2011/03/28 Javascript
javascript数组去重3种方法的性能测试与比较
2013/03/26 Javascript
js控制input输入字符解析
2013/12/27 Javascript
Node.js中使用mongoskin操作mongoDB实例
2014/09/28 Javascript
使用AmplifyJS组件配合JavaScript进行编程的指南
2015/07/28 Javascript
Bootstrap Table服务器分页与在线编辑应用总结
2016/08/08 Javascript
JavaScript html5利用FileReader实现上传功能
2020/03/27 Javascript
vue中用H5实现文件上传的方法实例代码
2017/05/27 Javascript
微信小程序tabBar底部导航中文注解api详解
2017/08/16 Javascript
Javascript中 toFixed四舍六入方法
2017/08/21 Javascript
微信小程序云开发之云函数详解
2019/05/16 Javascript
el-table表头根据内容自适应完美解决表头错位和固定列错位
2021/01/07 Javascript
pymongo实现多结果进行多列排序的方法
2015/05/16 Python
在windows系统中实现python3安装lxml
2016/03/23 Python
Python迭代器与生成器基本用法分析
2018/07/26 Python
python获取服务器响应cookie的实例
2018/12/28 Python
Python正则表达式匹配数字和小数的方法
2019/07/03 Python
python 爬取学信网登录页面的例子
2019/08/13 Python
使用SQLAlchemy操作数据库表过程解析
2020/06/10 Python
浅谈matplotlib 绘制梯度下降求解过程
2020/07/12 Python
HTML5拖放API实现拖放排序的实例代码
2017/05/11 HTML / CSS
HTML5离线应用与客户端存储的实现
2018/05/03 HTML / CSS
BAILEY 44官网:美国制造的女性服装
2019/07/01 全球购物
CK巴西官方网站:Calvin Klein巴西
2019/07/19 全球购物
戴森比利时官方网站:Dyson BE
2020/10/03 全球购物
StringBuilder和String的区别
2015/05/18 面试题
信息科学与技术专业求职信范文
2014/02/20 职场文书
学校做一个有道德的人活动方案
2014/08/23 职场文书
2014党员学习习主席讲话思想汇报
2014/09/15 职场文书
Go语言-为什么返回值为接口类型,却返回结构体
2021/04/24 Golang