1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > vue根据接口返回数据状态给按钮动态设置disabled属性

vue根据接口返回数据状态给按钮动态设置disabled属性

时间:2022-04-01 23:10:31

相关推荐

vue根据接口返回数据状态给按钮动态设置disabled属性

这里写自定义目录标题

1种htmldata方法2种htmldata方法最后

1种

html

<b-button variant="success" @click="getCancel" :disabled="isDisabled.status === 0 || isDisabled.status === 1 || isDisabled.status === 2 ?false : true">测试</b-button

data

// 0 、1、2j接口返回的就是设置为trueisDisabled: {status: null}

方法

接口返回并且赋值status

submitCancel(hide) {// 返回状态取消后设置disabled Disable// console.log('valll');const _this = this;_this.tableBusy = true;let id = _this.detailsData.id_this.$store.dispatch("purchaseOrder/getPurchaseOrderCancel", {id: id}).then((res) => {// 看接口返回的0~2就是true,超过就是false_this.isDisabled =res.status}).finally(() => {_this.tableBusy = false;hide();});},

2种

html

<b-button variant="success" @click="getCancel" :disabled="isDisabled">Cancel</b-button>

data

isDisabled: false,// 按钮是否禁用,接口返回cancel代表设置为true // 注意:这里false一定不要加双引号代表是字符串,直接写true,或者false代表布尔值

方法

接口返回并且赋值status

submitCancel(hide) {// 返回状态取消后设置disabled// console.log('valll');const _this = this;_this.tableBusy = true;let id = _this.detailsData.id_this.$store.dispatch("purchaseOrder/getPurchaseOrderCancel", {id: id}).then((res) => {// 主要这里返回的是1代表设置为true !!!if (res === 1) {_this.isDisabled = true}}).finally(() => {_this.tableBusy = false;hide();});},

如果遇到新的方法还会来此处更新,大家有新的方法也可以写在评论区,可以借鉴参考一下,共同进步!!!

参考1

参考2

参考3

参考4

最后

感觉文章好的话记得点个心心和关注,有错的地方麻烦指正一下,多谢!!!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。