关于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 相关文章推荐
基于jQuery的前端数据通用验证库
Aug 08 Javascript
JS获取表格内指定单元格html内容的方法
Mar 31 Javascript
SWFObject基本用法实例分析
Jul 20 Javascript
js点击文本框弹出可选择的checkbox复选框
Feb 03 Javascript
AngularJs 国际化(I18n/L10n)详解
Sep 01 Javascript
bootstrap flask登录页面编写实例
Nov 01 Javascript
JS正则表达式验证中文字符
May 08 Javascript
vue中子组件传递数据给父组件的讲解
Jan 27 Javascript
JavaScript实现预览本地上传图片功能完整示例
Mar 08 Javascript
vue-cli3中配置alias和打包加hash值操作
Sep 04 Javascript
Vite和Vue CLI的优劣
Jan 30 Vue.js
vue中div禁止点击事件的实现
Apr 02 Vue.js
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
PHP 文件编程综合案例-文件上传的实现
2013/07/03 PHP
ThinkPHP模板中判断volist循环的最后一条记录的验证方法
2014/07/01 PHP
可以保证单词完整性的PHP英文字符串截取代码分享
2014/07/15 PHP
PHP实现通过URL提取根域名
2016/03/31 PHP
php+jQuery递归调用POST循环请求示例
2016/10/14 PHP
jquery更换文章内容与改变字体大小代码
2013/09/30 Javascript
js去空格技巧分别去字符串前后、左右空格
2013/10/21 Javascript
基于jQuery通过jQuery.form.js插件使用ajax提交form表单
2015/08/17 Javascript
js格式化输入框内金额、银行卡号
2016/02/01 Javascript
js动态生成form 并用ajax方式提交的实现方法
2016/09/09 Javascript
jquery——九宫格大转盘抽奖实例
2017/01/16 Javascript
JS中如何实现点击a标签返回页面顶部的问题
2017/01/19 Javascript
详解微信小程序Radio选中样式切换
2017/07/06 Javascript
javascript cookie的基本操作(添加和删除)
2017/07/24 Javascript
Vue.js 2.0和Cordova开发webApp环境搭建方法
2018/02/26 Javascript
原生js实现移动端Touch轮播图的方法步骤
2019/01/03 Javascript
详解vue-cli+es6引入es5写的js(两种方法)
2019/04/19 Javascript
如何基于vue-cli3.0构建功能完善的移动端架子
2019/04/24 Javascript
js实现双色球效果
2020/08/02 Javascript
vue 添加和编辑用同一个表单,el-form表单提交后清空表单数据操作
2020/08/03 Javascript
Vue单页面应用中实现Markdown渲染
2021/02/14 Vue.js
[01:34:42]NAVI vs EG 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
wxPython窗口的继承机制实例分析
2014/09/28 Python
Python语言的面相对象编程方式初步学习
2016/03/12 Python
Python 实现简单的shell sed替换功能(实例讲解)
2017/09/29 Python
python 使用sys.stdin和fileinput读入标准输入的方法
2018/10/17 Python
python 调用钉钉机器人的方法
2019/02/20 Python
python迭代器常见用法实例分析
2019/11/22 Python
python标准库os库的函数介绍
2020/02/12 Python
SpringBoot实现登录注册常见问题解决方案
2020/03/04 Python
python判断元素是否存在的实例方法
2020/09/24 Python
生日寄语大全
2014/04/08 职场文书
生物科学专业毕业生求职信
2014/06/02 职场文书
学校百日安全活动总结
2015/05/07 职场文书
安全教育日主题班会
2015/08/13 职场文书
mysql序号rownum行号实现方式
2022/12/24 MySQL