vue select组件的使用与禁用实现代码
时间:2019-04-14
本文章向大家介绍vue select组件的使用与禁用实现代码,主要包括vue select组件的使用与禁用实现代码使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
业务:消息推送方式有两种,为“微信”和“邮件”,微信发送时需要选择“要发送的应用程序”,邮件发送时不需要
微信发送时,页面如下:
邮件发送时,选择器不可用,页面如下:
虽然官网上没有给出具体的例子,但可从属性中查到 “disabled”属性,
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
disabled | 是否禁用 | Boolean | false |
实现:
添加disabled属性,写成如下红色标记格式;定义一个isAble变量,用来存放TRUE和FALSE值,决定此选择框是否可用。
<Select <span style="color: rgb(255, 0, 0);">v-bind:disabled="isAble" </span>clearable v-model="dataAgentEntity.ID" style="width:240px"> <Option v-for="item in dataAgent" :value="item.ID" :key="item.ID">{{ item.name }}</Option> </Select> export default { data(){ return{ isAble: false,//select下拉框是否可用 } }
然后就是逻辑中操作变量isAble的值,改变组件的可用禁用状态了
methods:{ Test(){ var vm = this; if (vm.alertType == '邮件') { vm.isAble = true; //不可用 } } }
test方法中只写了判断不可用,改回微信时,还要变成可用状态,不然又埋了个bug,哈哈。不过这是业务逻辑了,只介绍方法,记个笔记,具体视情况而定。
总结
以上所述是小编给大家介绍vue select组件的使用与禁用实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!
- iOS学习——自动定位
- iOS学习——iOS原生实现二维码扫描
- iOS学习——iOS开发小知识点集合
- iOS学习——@class和#import的区别
- iOS学习——UIView的研究
- iOS学习——布局利器Masonry框架源码深度剖析
- iOS项目——自定义UITabBar与布局
- @FeignClient中的@RequestMapping也被Spring MVC加载的问题解决
- Golang语言中Path包用法
- Golang中container/list包中的坑
- 关于Golang语言数组索引的有趣现象
- Golang不定参数
- Go并发编程基础(译)
- go-concurrent-programming.md
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- mybatis-plus自定义sql注入器
- k8s代码走读---kube-controller-manager
- 我们一起学一学渗透测试——黑客应该掌握的HTML基础知识(一)
- 一套漏洞组合拳接管你的账号
- 我们一起学一学渗透测试——黑客应该掌握的HTML基础知识(二)
- 我用Paddle Lite在树莓派3b+上从零开始搭建“实时表情识别”项目
- mybatis-plus:自动填充功能
- 词义类比与全局词共现信息不可兼得?基于飞桨实现的GloVe说可以
- MyBatis-plus乐观锁插件
- Jmeter(十九) - 从入门到精通 - JMeter监听器 -上篇(详解教程)
- python---rsa加密根据指数和模生成加密参数模板
- 搞了这么多年终于知道接口和抽象类的应用场景了
- css实现页面加载动画
- 用Dota2“最强”算法PPO完成CarPole和四轴飞行器悬浮任务
- 【pyspark】广播变量のdestroy...