vue使用axios发送get、post请求
在使用axios前,确保安装了axios,以及在main.js中导入并使用了npm install axiosimport axios from 'axios'import VueAxios from 'vue-axios'Vue.use(VueAxios,axios);1.axios发送get请求var url = "http://localhost:8080/personblo...
·
在使用axios前,确保安装了axios,以及在main.js中导入并使用了
npm install axios
import axios from 'axios'
import VueAxios from 'vue-axios'
Vue.use(VueAxios,axios);
1.axios发送get请求
var url = "http://localhost:8080/personblog/users/login";
var that = this;
that.axios.get(url,{
params:{
'username': that.ruleForm.username,
'password': that.ruleForm.password
}
}).then(function (res) {
if (res.data.code == 200) {
that.user = res.data.data;
console.log(res.data.data);
}
console.log(res.data.msg);
}).catch(function (error) {
console.log(error);
});
2.axios发送post请求
里面用到了qs所以我们需要安装qs: npm install qs
然后在main.js里面加入
import qs from 'qs';
Vue.prototype.$qs = qs
这样我们就可以使用post请求了
var url = "http://localhost:8080/personblog/users/login";
var that = this;
that.axios.post(url, that.$qs.stringify({
'username': that.ruleForm.username,
'password': that.ruleForm.password
})).then(function (res) {
if (res.data.code == 200) {
that.user = res.data.data;
console.log(res.data.data.username);
// console.log(that.user.password);
}
console.log(res.data.msg);
}).catch(function (error) {
console.log(error);
});
后端接收
@PostMapping("login")
public Map<String, Object> login(@Param("username") String username, @Param("password") String password) {
Users user = usersService.login(username, password);
if(user==null){
return Json.fail("查询失败!");
}
return Json.success(user, "查询成功!");
}
参考链接1:解决post不能传参问题
https://www.jianshu.com/p/6bca2512803c
参考链接2:axios各种请求传参
https://www.cnblogs.com/zyh-club/p/11201592.html
参考链接3:安装常用插件 Element、axios、qs、Vant、echartsjs
https://www.cnblogs.com/lidonglin/p/11473733.html
更多推荐
已为社区贡献3条内容
所有评论(0)