vue中使用js控制button的disabled属性

<button ref="btn">按钮</button>

最好不要使用this.$refs.btn.setAttribute('disabled',true);禁用按钮

因为这个的效果和this.$refs.btn.setAttribute('disabled',false);是一样的,都禁用按钮了,因为true或者false被转化为了字符串,而这个字符串基本等效于true,也就是都是禁用的写法

而若是改为this.$refs.btn.disabled = true(禁用按钮),this.$refs.btn.disabled = false(可用按钮)就能满足正常的需求了

不过非要使用setAttribute也不是不行,要取消禁用按钮就要配合removeAttribute使用了:

this.$refs.btn.removeAttribute('disabled');

vue不太建议使用dom,所以当然在标签中写啦, :disabled=flag(注意flag不要加引号,flag在data中设为Boolean值)

vue中使用js控制button的disabled属性相关推荐

vue中通过js控制页面样式方法
在使用vue.js框架的时候,有时候会希望在页面渲染完成之后,再执行函数方法来处理初始化相关的操作,如果只处理页面位置.宽或者高时,必须要在页面完全渲染之后才可以,页面没有加载完成之前,获取到的宽高不 ...
Vue中的Js动画与Velocity.js 的结合
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
vue中通过js加载图片显现
在vue开发中会遇到这样的问题:有时需要在img中加载多个静态资源的图片,如果我们将src的路径整个定义成一个变量,会发现img加载不出来正个图片的路径,其实此时需要require()来加载静态资源的 ...
css、js控制html标签的属性和内容
css.html <!DOCTYPE html> <html> <head><title>js控制html标签的属性和内容</title>& ...
vue中，点击button按钮后，页面上的input框再次自动获取焦点
需求:点击button按钮,录入成功后,页面上的input框自动聚焦,快速进行下一次录入,提高效率开始尝试了几种方法都没有成功一.首先想到的用vue指令 v-focus,然而没有成功 <In ...
Vue中向js中传递参数并在js中定义对象并转换参数
场景有下面这种主从表结构上面的信息是主表的信息,下面是从表的信息. 在Vue中将页面的信息传递到js的方法中,在js方法中将参数进行转换使其与后台接收的参数相匹配. 注: 博客: https:// ...
Vue中Three.js的天空盒
踩坑:vue使用three.js中CubeTextureLoader()加载图片不能直接使用load()路径获取,如.load( [ '-/-/img/posx.jpg', ] ).. .需要先req ...
vue中使用js进行AES加密及解密（含密钥和iv偏移量）、以及HMAC-SHA256加密方法对于签名加密的使用
一.AES加密解密 1.下载安装 npm install crypto-js --save-dev 2.在utils文件夹下创建encryp.js文件进行aes加密解密工具类方法的封装 import ...
js 获取vue组件html_关于Vue中main.js，App.vue，index.html之间关系进行总结
在初始化的Vue项目中,我们最先接触到的就是main.js,App.vue,index.html这三个文件,我们从培训视频或者官方文档上可以了解到: index.html---主页,项目入口 App. ...

vue中使用js控制button的disabled属性

vue中使用js控制button的disabled属性相关推荐

最新文章

热门文章