vue动态禁用控件绑定disable的例子


Posted in Javascript onOctober 28, 2019

场景

报修范围取值不同时 ,区域有时需要禁用

代码

<el-form-item label="报修范围" prop="applicationRange" >

<el-select v-model="addInfo.applicationRange" placeholder="请选择报修范围" style="width: 200px" @change="inputToDisabled" >

  <el-option v-for="item in applicationRangeList" :key="item.value" :label="item.label" :value="item.value">

            </el-option>

</el-select>

</el-form-item>
<el-form-item label="区域" prop="areaCodeAdd">

<el-select v-model="addInfo.areaCodeAdd" placeholder="请选择区域" v-on:change="getBuildListAdd" style="width: 220px" :disabled="isAble" >

<el-option

v-for="item in areaListAdd"

:key="item.value"

:label="item.label"

:value="item.value">

</el-option>

</el-select>

</el-form-item>
methods:{

 inputToDisabled (){

   if (this.addInfo.applicationRange === '1002') {

       this.isAble = true; // 注意true是不可用

    } else{

       this.isAble = false; //可用

    }

  },

}

以上这篇vue动态禁用控件绑定disable的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
正则表达式判断是否存在中文和全角字符和判断包含中文字符串长度
Sep 27 Javascript
JavaScript的parseInt 取整使用
May 09 Javascript
javascript:window.open弹出窗口的位置问题
Mar 18 Javascript
jquery实现在页面加载的时自动为日期插件添加当前日期
Aug 20 Javascript
jQuery弹簧插件编写基础之“又见弹窗”
Dec 11 Javascript
jQuery动态添加可拖动元素完整实例(附demo源码下载)
Jun 21 Javascript
AngularJS 与Bootstrap实现表格分页实例代码
Oct 14 Javascript
Angular2从搭建环境到开发步骤详解
Oct 17 Javascript
js与jquery分别实现tab标签页功能的方法
Nov 18 Javascript
JS设置时间无效问题的解决办法
Feb 18 Javascript
Chart.js 轻量级HTML5图表绘制工具库(知识整理)
May 22 Javascript
jquery实现简单每周轮换的日历
Sep 10 jQuery
VUE.js实现动态设置输入框disabled属性
Oct 28 #Javascript
关于vue组件事件属性穿透详解
Oct 28 #Javascript
对vue中的事件穿透与禁止穿透实例详解
Oct 28 #Javascript
vue h5移动端禁止缩放代码
Oct 28 #Javascript
在Vue项目中,防止页面被缩放和放大示例
Oct 28 #Javascript
element-ui 本地化使用教程详解
Oct 28 #Javascript
vue 全局环境切换问题
Oct 27 #Javascript
You might like
PHP 第二节 数据类型之字符串类型
2012/04/28 PHP
php中url函数介绍及使用示例
2014/02/13 PHP
PHP小技巧之JS和CSS优化工具Minify的使用方法
2014/05/19 PHP
PHP反向代理类代码
2014/08/15 PHP
PHP二维数组实现去除重复项的方法【保留各个键值】
2017/12/21 PHP
计算新浪Weibo消息长度(还可以输入119字)
2013/07/02 Javascript
简单的JS时钟实例讲解
2016/01/13 Javascript
基于javascript实现文字无缝滚动效果
2016/03/22 Javascript
js严格模式总结(分享)
2016/08/22 Javascript
jQuery中的select操作详解
2016/11/29 Javascript
原生js轮播(仿慕课网)
2017/02/15 Javascript
js实现3d悬浮效果
2017/02/16 Javascript
Node.js中Bootstrap-table的两种分页的实现方法
2017/09/18 Javascript
基于vue监听滚动事件实现锚点链接平滑滚动的方法
2018/01/17 Javascript
对类Vue的MVVM前端库的实现代码
2018/09/07 Javascript
详解Vue中的自定义指令
2020/12/07 Vue.js
python实现哈希表
2014/02/07 Python
Python import用法以及与from...import的区别
2015/05/28 Python
Python3.5编程实现修改IIS WEB.CONFIG的方法示例
2017/08/18 Python
python正则表达式re之compile函数解析
2017/10/25 Python
Python调用C语言的方法【基于ctypes模块】
2018/01/22 Python
python判断列表的连续数字范围并分块的方法
2018/11/16 Python
python如何获取列表中每个元素的下标位置
2019/07/01 Python
python绘制直方图和密度图的实例
2019/07/08 Python
python爬虫分布式获取数据的实例方法
2020/11/26 Python
使用CSS3在触屏上为按钮实现激活效果
2013/09/27 HTML / CSS
canvas画布实现手写签名效果的示例代码
2019/04/23 HTML / CSS
温泉秘密:Onsen Secret
2020/07/06 全球购物
就业自荐书
2013/12/05 职场文书
社区庆八一活动方案
2014/02/02 职场文书
开会迟到检讨书
2014/02/03 职场文书
医学生个人求职信范文
2014/02/07 职场文书
工程索赔意向书
2014/08/30 职场文书
python简单验证码识别的实现过程
2021/06/20 Python
Python常用配置文件ini、json、yaml读写总结
2021/07/09 Python
PYTHON 使用 Pandas 删除某列指定值所在的行
2022/04/28 Python