需求:避免点击开始考试时,用户在同一时刻多次点击(防止重复提交的问题)
(1)给按钮绑定( :loading=“btnLoading”)
<el-button type="primary"
:loading="btnLoading"
@click="startTest">{{test.paperId ? '继续' : '开始'}}测试</el-button>
(2)在data中初始化 btnLoading:
data () {
return {
btnLoading: false
}
},
(3)点击开始考试时设置:
async startTest (type) {
if (this.btnLoading) return
this.btnLoading = true //在考卷没有出来时,加载效果
let _test = this.test
let _params = {
configId: _test.id,
paperId: type === 'result' ? null : _test.paperId
}
this.testShow = false
let { data } = await startTestApi(_params)
this.btnLoading = false //在考卷出来后,关闭加载效果
if (data.success) {
this.testData = data.operateCallBackObj
this.testShow = true
} else {
this.$message({
message: data.operateMessage,
type: 'error'
})
}
}
「喜欢这篇文章,您的关注和赞赏是给作者最好的鼓励」
关注作者
【版权声明】本文为墨天轮用户原创内容,转载时必须标注文章的来源(墨天轮),文章链接,文章作者等基本信息,否则作者和墨天轮有权追究责任。如果您发现墨天轮中有涉嫌抄袭或者侵权的内容,欢迎发送邮件至:contact@modb.pro进行举报,并提供相关证据,一经查实,墨天轮将立刻删除相关内容。




