Vue中实现避免按钮多次点击造成发送多次重复请求 |
您所在的位置：网站首页 › vue点击按钮发送请求 › Vue中实现避免按钮多次点击造成发送多次重复请求 |
Vue中实现避免按钮多次点击造成发送多次重复请求
|
store文件中设置一个变量，全局管理按钮的禁用和解除禁用，方便组件之间的通信 lineChart.vue获取数据显示曲线组件，不论获取到后端怎样的数据，都将按钮禁用解除，置为false methods: { getData(){ this.axios.post('/api/search/getgraph/predict/linechart', JSON.stringify(this.form), {headers:{'Content-Type':'application/json;charset=UTF-8'}}).then(result => { console.log("linePredictData:",result.data.data.coordinate) ........ if (result.data.code === 200 && result.data.data.coordinate.length > 1) { ....... this.flag = true this.$Message.success( { content:'预测曲线更新完成', duration: 8, closable: true } ); this.$store.state.isDisable = false //解除按钮禁用 this.myChart.clear() this.init() } else if(result.data.code === 200 && result.data.data.coordinate.length === 1){ this.$Message.info({ content: '此时间段内无数据，请重新选择', top:100, duration: 8, closable: true }); this.$store.state.isDisable = false //解除按钮禁用 this.myChart.clear() this.init() }else if(result.data.data === null){ this.flag = false this.$Message.error({ content: '预测模块超时，请联系预测人员', duration: 8, closable: true }); this.$store.state.isDisable = false //解除按钮禁用 } }).catch((error) => console.log(error)) }, } |
select.vue发送表单组件，表单没有填写完整时也要将按钮禁用解除【本文地址】
今日新闻 |
推荐新闻 |