vue中动态绑定表单元素的属性方法


Posted in Javascript onFebruary 23, 2018

在vue中有时候可能想像使用jq一样给某个元素添加属性,如

$('#select1').attr('disabled','disabled')

这种方法也能实现,但是在vue中能用vue的方法还是尽量不要使用jq

使用vue的方法来添加属性可以这样:

<select v-model='issues' class="ui dropdown t-select-list" :disabled='isDisabled'>
 <option></option>
</selected>

disabled是表单元素的原生属性,可以直接使用属性绑定的语法 :disabled 来绑定,然后加上一个条件就可以控制这个属性动态添加删除,如:

watch:{
 issueDatas(){
  if(this.issueDatas.state==5){
   this.isDisabled=true;
  }
 }
}

当状态为5的时候就能让select为只读状态

以上这篇vue中动态绑定表单元素的属性方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
如何用javascript去掉字符串里的所有空格
Feb 08 Javascript
javascript 密码强弱度检测万能插件
Feb 25 Javascript
javascript dom 操作详解 js加强
Jul 13 Javascript
js DOM 元素ID就是全局变量
Sep 20 Javascript
JavaScript截断字符串的方法
Jul 15 Javascript
学习javascript面向对象 实例讲解面向对象选项卡
Jan 04 Javascript
JavaScript和jQuery获取input框的绝对位置实现方法
Oct 13 Javascript
基于layer.js实现收货地址弹框选择然后返回相应的地址信息
May 26 Javascript
详解vue2.0 不同屏幕适配及px与rem转换问题
Feb 23 Javascript
jquery 动态遍历select 赋值的实例
Sep 12 jQuery
教你搭建按需加载的Vue组件库(小结)
Jul 29 Javascript
深入解读VUE中的异步渲染的实现
Jun 19 Javascript
Vue之Vue.set动态新增对象属性方法
Feb 23 #Javascript
vue2.0在没有dev-server.js下的本地数据配置方法
Feb 23 #Javascript
Vue实现带进度条的文件拖动上传功能
Feb 23 #Javascript
详解vue2.0 不同屏幕适配及px与rem转换问题
Feb 23 #Javascript
解决vue中对象属性改变视图不更新的问题
Feb 23 #Javascript
在Vue组件上动态添加和删除属性方法
Feb 23 #Javascript
vue 路由页面之间实现用手指进行滑动的方法
Feb 23 #Javascript
You might like
用PHP控制用户的浏览器--ob*函数的使用说明
2007/03/16 PHP
PhpMyAdmin中无法导入sql文件的解决办法
2010/01/08 PHP
真正根据utf8编码的规律来进行截取字符串的函数(utf8版sub_str )
2012/10/24 PHP
Smarty变量用法详解
2016/05/11 PHP
php变量与JS变量实现不通过跳转直接交互的方法
2017/08/25 PHP
PHP实现对数字分隔加千分号的方法
2019/03/18 PHP
解决laravel session失效的问题
2019/10/14 PHP
将jQuery应用于login页面的问题及解决
2009/10/17 Javascript
简单易用的倒计时js代码
2014/08/04 Javascript
javascript框架设计读书笔记之模块加载系统
2014/12/02 Javascript
node.js中的fs.readdirSync方法使用说明
2014/12/17 Javascript
javascript解决小数的加减乘除精度丢失的方案
2016/05/31 Javascript
bootstrap模态框跳转到当前模板页面 框消失了而背景存在问题的解决方法
2020/11/30 Javascript
js仿百度音乐全选操作
2017/01/13 Javascript
为Jquery EasyUI 组件加上清除功能的方法(详解)
2017/04/13 jQuery
Vue中用props给data赋初始值遇到的问题解决
2018/11/27 Javascript
如何用RxJS实现Redux Form
2018/12/29 Javascript
微信小程序实现折线图的示例代码
2019/06/07 Javascript
vue中使用elementUI组件手动上传图片功能
2019/12/13 Javascript
js 获取扫码枪输入数据的方法
2020/06/10 Javascript
基于vue+echarts数据可视化大屏展示的实现
2020/12/25 Vue.js
在MAC上搭建python数据分析开发环境
2016/01/26 Python
python编码总结(编码类型、格式、转码)
2016/07/01 Python
win10系统Anaconda和Pycharm的Tensorflow2.0之CPU和GPU版本安装教程
2019/12/03 Python
把Anaconda中的环境导入到Pycharm里面的方法步骤
2020/10/30 Python
HomeAway澳大利亚:预订你的度假屋,公寓、度假村、别墅等
2019/02/20 全球购物
Myprotein法国官网:欧洲第一运动营养品牌
2019/03/26 全球购物
如何减少垃圾回收让内存更加有效使用
2013/10/18 面试题
运行时异常与一般异常有何异同?
2014/01/05 面试题
房地产管理毕业生自荐信
2013/11/04 职场文书
希特勒经典演讲稿
2014/05/19 职场文书
关于青春的演讲稿500字
2014/08/22 职场文书
反邪教观后感
2015/06/11 职场文书
创业计划书之电动车企业
2019/10/11 职场文书
微信小程序实现录音Record功能
2021/05/09 Javascript
HTML通过表单实现酒店筛选功能
2021/05/18 HTML / CSS