学习别人的视频中,发起get请求,
更新一下完整代码
html就简单描述一下,有个 按钮,点击事件是onSendSms,目的是获取手机验证码
async onSendSms () {
// 1.校验手机号
try {
await this.$refs.loginFormRef.validate('mobile')
console.log('验证通过')
} catch (err) {
return console.log('验证失败', err)
}
// 2.验证通过,显示倒计时
this.iscountShow = true
// 3.请求发送验证码
try {
// const { data: res } = await sendSms(this.user.mobile)
const res = await sendSms(this.user.mobile)
// const res = await this.axios.get(`http://ttapi.research.itcast.cn/app/v1_0/sms/codes/${this.user.mobile}`)
this.$toast('发送成功')
console.log('发送成功', res)
} catch (err) {
this.iscountShow = false
if (err.response.status === 429) {
return this.$toast('发送太频繁,请稍后重试')
} else {
console.log('发送失败', err)
}
}
}
这是封装的初始请求模块
/**
* 请求模块
*/
import axios from 'axios'
const request = axios.create({
baseURL: 'http://ttapi.research.itcast.cn/' // 接口的基准路径
})
这是第二次封装请求模块
export const sendSms = mobile => {
return request({
method: 'GET',
url: `/app/v1_0/sms/codes/${mobile}`
})
}
我调用的源生的axios请求,应该是直接跳过这些封装的,和这些封装没什么关系
你的axios二次封装的不对劲
封装之后应该是你返回 出去一个promise对象的。
至于为什么你注释的那个 this.axios 是个什么东西?你也没发
目前看的话,没有网络传输,没有报错。那就是根本就没有调用吧??
不太清楚 网络请求这个,有时候放一页代码都找不到问题 何况你还没发全。
找到问题了,直接在当前页面导入axios 去掉this,是能够发出请求的,可能是没有全局导入axios,这个this不知道指到什么地方去了,如果使用app.config.globalProperties.$http = axios 全局导入,将不会出现这个问题,谢谢各位