关于vue属性使用和不使用冒号的区别说明


Posted in Javascript onOctober 22, 2020

vue中冒号:是v-bind的缩写。

一直最常见的做法是代表绑定一个变量。

但是我今天用到复选框是时候缺出现选不中的情况

<el-checkbox v-model="checked" >备选项</el-checkbox> checked:1但是没有选中

然后我想可能是没有写true-label,于是这样写。因为true-label接收一个数值或者字符串。我的默认值是数值。

<el-checkbox v-model="checked" true-label=1 false-label=0 >备选项</el-checkbox> 但是还是没有选中

然后看了

关于vue属性使用和不使用冒号的区别说明

但是定义的 checked:1类型是数值并不是boolean型的

我们可以这样修改

<el-checkbox v-model="checked" :true-label="1" :false-label="0" >备选项</el-checkbox>

<input :disable="true">打开</input>

输出:true 或 false 值是变量Boolean类型

<input disable="true">打开</input>

输出:true 值是String类型

补充知识:Vue的标签属性label中字符串拼接变量

问题

问题描述:Vue的标签属性label中字符串拼接变量

问题解决

<el-form-item :label="`参数${(index + 1)}类型`" v-for="(item, index,) in props.row.params">
  <span v-text="item"></span>
</el-form-item>

结果展示

关于vue属性使用和不使用冒号的区别说明

以上这篇关于vue属性使用和不使用冒号的区别说明就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
toString()一个会自动调用的方法
Feb 08 Javascript
$.format,jquery.format 使用说明
Jul 13 Javascript
动态获取复选框checkbox选中个数的jquery代码
Jun 25 Javascript
javascript实现的HashMap类代码
Jun 27 Javascript
JS+CSS实现Div弹出窗口同时背景变暗的方法
Mar 04 Javascript
JS实现简单路由器功能的方法
May 27 Javascript
JavaScript如何动态创建table表格
Aug 02 Javascript
Node.js操作redis实现添加查询功能
May 25 Javascript
JS实现左边列表移到到右边列表功能
Mar 28 Javascript
详解js类型判断
May 22 Javascript
解决Vue 刷新页面导航显示高亮位置不对问题
Dec 25 Javascript
vue项目中微信登录的实现操作
Sep 08 Javascript
jquery实现抽奖功能
Oct 22 #jQuery
Vue实现简单的留言板
Oct 23 #Javascript
Vue+Bootstrap收藏(点赞)功能逻辑与具体实现
Oct 22 #Javascript
JavaScript实现简易计算器小功能
Oct 22 #Javascript
vue实现简单加法计算器
Oct 22 #Javascript
微信小程序实现选项卡滑动切换
Oct 22 #Javascript
微信小程序实现文件预览
Oct 22 #Javascript
You might like
各种快递查询--Api接口
2016/04/26 PHP
php 实现一个字符串加密解密的函数实例代码
2016/11/01 PHP
php数据库的增删改查 php与javascript之间的交互
2017/08/31 PHP
Laravel中encrypt和decrypt的实现方法
2017/09/24 PHP
PHP用swoole+websocket和redis实现web一对一聊天
2019/11/05 PHP
JavaScript Array扩展实现代码
2009/10/14 Javascript
CCPry JS类库 代码
2009/10/30 Javascript
textarea中的手动换行处理的jquery代码
2011/02/26 Javascript
深入理解JavaScript系列(7) S.O.L.I.D五大原则之开闭原则OCP
2012/01/15 Javascript
Nodejs+express+html5 实现拖拽上传
2014/08/08 NodeJs
innerHTML在IE中报错解决方案
2014/12/15 Javascript
学习JavaScript设计模式之迭代器模式
2016/01/19 Javascript
JS简单实现DIV相对于浏览器固定位置不变的方法
2016/06/17 Javascript
浅谈AngularJs指令之scope属性详解
2016/10/24 Javascript
js正则表达式最长匹配(贪婪匹配)和最短匹配(懒惰匹配)用法分析
2016/12/27 Javascript
重新理解JavaScript的六种继承方式
2017/03/24 Javascript
Angular2使用Angular CLI快速搭建工程(一)
2017/05/21 Javascript
JavaScript设计模式之代理模式详解
2017/06/09 Javascript
Angular.js中数组操作的方法教程
2017/07/31 Javascript
Node.js在图片模板上生成二维码图片并附带底部文字说明实现详解
2019/08/07 Javascript
python自动翻译实现方法
2016/05/28 Python
Python如何为图片添加水印
2016/11/25 Python
Pandas 按索引合并数据集的方法
2018/11/15 Python
python使用Plotly绘图工具绘制柱状图
2019/04/01 Python
python-opencv获取二值图像轮廓及中心点坐标的代码
2019/08/27 Python
python 两个数据库postgresql对比
2019/10/21 Python
巴西美妆购物网站:Kutiz Beauté
2019/03/13 全球购物
应届大学生的推荐信
2013/11/20 职场文书
保护环境倡议书300字
2014/05/19 职场文书
数控机床专业自荐信
2014/05/19 职场文书
诉讼授权委托书范本
2014/10/05 职场文书
普通党员个人剖析材料
2014/10/08 职场文书
2015年安全生产目标责任书
2015/01/29 职场文书
青春雷锋观后感
2015/06/10 职场文书
SQL实现LeetCode(175.联合两表)
2021/08/04 MySQL
MongoDB修改oplog大小的四种方法
2022/04/11 MongoDB