Vue隐藏显示、只读实例代码


Posted in Javascript onJuly 18, 2018

1.Vue隐藏显示

<div style="padding-top:5px;" v-bind:class="{hidden: isHidden }">
 <label class="inline">
    <input id="id-button-borders" checked="" v-model="user.userstate" type="checkbox" class="ace ace-switch ace-switch-5" />
    <span class="lbl"></span>
 </label>
 </div>

data:{
    isHidden: true
  }

•v-bind:class=”{hidden: isHidden }” 可动态设置vm.isHidden值
•:class=”{hidden: isHidden }” 简写

2.Vue控件只读

<input type="text" class="form-control" v-bind:readonly="isReadOnly" validate="notNull,realname" v-model="user.realname"/>1

data:{

    isReadOnly:false
  }

•v-bind:readonly=”isReadOnly” 可动态设置vm.isReadOnly

总结

以上所述是小编给大家介绍的Vue隐藏显示、只读实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript DOM 学习第五章 表单简介
Feb 19 Javascript
JS中如何设置readOnly的值
Dec 25 Javascript
JS 实现列表与多选框选择附预览动画
Oct 29 Javascript
jQuery不使用插件及swf实现无刷新文件上传
Dec 08 Javascript
jQuery+HTML5+CSS3制作支持响应式布局时间轴插件
Aug 10 Javascript
JavaScript组成、引入、输出、运算符基础知识讲解
Dec 08 Javascript
vue封装一个简单的div框选时间的组件的方法
Jan 06 Javascript
vue.js指令v-for使用以及下标索引的获取
Jan 31 Javascript
JS中实现浅拷贝和深拷贝的代码详解
Jun 05 Javascript
微信小程序实现圆形进度条动画
Nov 18 Javascript
微信域名检测接口调用演示步骤(含PHP、Python)
Dec 08 Javascript
JavaScript快速调试的两个技巧
Nov 04 Javascript
详解vue中axios的封装
Jul 18 #Javascript
详解vue2.0监听属性的使用心得及搭配计算属性的使用
Jul 18 #Javascript
微信小程序将字符串生成二维码图片的操作方法
Jul 17 #Javascript
使用Vue实现图片上传的三种方式
Jul 17 #Javascript
vue的token刷新处理的方法
Jul 17 #Javascript
vue 权限认证token的实现方法
Jul 17 #Javascript
vue 实现axios拦截、页面跳转和token 验证
Jul 17 #Javascript
You might like
PHP 进程锁定问题分析研究
2009/11/24 PHP
JS 判断undefined的实现代码
2009/11/26 Javascript
ASP.NET jQuery 实例13 原创jQuery文本框字符限制插件-TextArea Counter
2012/02/03 Javascript
JavaScript splice()方法详解
2020/09/22 Javascript
js动态拼接正则表达式的两种方法
2014/03/04 Javascript
自写的jQuery异步加载数据添加事件
2014/05/15 Javascript
跟我学Nodejs(三)--- Node.js模块
2014/05/25 NodeJs
DOM节点删除函数removeChild()用法实例
2015/01/12 Javascript
AngularJS实现分页显示数据库信息
2016/07/01 Javascript
基于BootStrap的Metronic框架实现页面链接收藏夹功能按钮移动收藏记录(使用Sortable进行拖动排序)
2016/08/29 Javascript
完美的js div拖拽实例代码
2016/09/24 Javascript
ng2学习笔记之bootstrap中的component使用教程
2017/03/09 Javascript
AngularJS表单验证功能分析
2017/05/26 Javascript
超级简易的JS计算器实例讲解(实现加减乘除)
2017/08/08 Javascript
JS+canvas绘制的动态机械表动画效果
2017/09/12 Javascript
JavaScript创建对象方式总结【工厂模式、构造函数模式、原型模式等】
2018/12/19 Javascript
ES6 Generator函数的应用实例分析
2019/06/26 Javascript
Javascript Web Worker使用过程解析
2020/03/16 Javascript
[04:49]期待西雅图之战 2016国际邀请赛中国区预选赛WINGS战队赛后采访
2016/06/29 DOTA
[00:11]战神迅矛
2019/03/06 DOTA
[01:19:46]DOTA2-DPC中国联赛 正赛 SAG vs DLG BO3 第一场 2月28日
2021/03/11 DOTA
python中os操作文件及文件路径实例汇总
2015/01/15 Python
python获取android设备的GPS信息脚本分享
2015/03/06 Python
Python输出9*9乘法表的方法
2015/05/25 Python
Python中列表、字典、元组数据结构的简单学习笔记
2016/03/20 Python
代码详解django中数据库设置
2019/01/28 Python
关于pytorch中全连接神经网络搭建两种模式详解
2020/01/14 Python
在Tensorflow中查看权重的实现
2020/01/24 Python
HTML5的download属性详细介绍和使用实例
2014/04/23 HTML / CSS
美国老牌主机服务商:iPage
2016/07/22 全球购物
法国设计制造的扫帚和刷子:Andrée Jardin
2018/12/06 全球购物
机关门卫制度
2014/02/01 职场文书
2014广电局实施党的群众路线教育实践活动方案思想汇报
2014/09/22 职场文书
如何写好竞聘报告
2019/04/03 职场文书
光之国的四大叛徒:第一贝利亚导致宇宙毁灭,赛文奥特曼在榜
2022/03/18 日漫
苹果发布了MagSafe固件更新,可以不外接电源实现最高7.5W充电
2022/04/21 数码科技