写了一个登录一个注册页面
主要是发送post请求获取数据,使用的是vue-resourse
【vue的练习项目(一)——vue-resourse请求数据】贴出请求数据的方法:
submitForm(formName){
//请求数据
var api='http://118.25.229.125:8888/api/v1/login/';
this.$http.post(api,{username:this.loginForm.name,password:this.loginForm.pass},{emulateJSON: true}).then((response)=>{
console.log(response);
//注意this指向
// 登录成功code为1000
this.code = response.body.code;
this.$refs[formName].validate((valid) => {
if(valid){
if(this.code == '1000'){
alert('success');
}else{
alert('用户名或密码错误')
}
}else{
console.log('error submit');
return false;
}
})},function(err){console.log(err);
});
},
接下来要写一个订单页面,获取订单数据需要有token,这里我先将登录获取的token拿过来
贴出请求订单数据的get方法:
getOrder(){
var api = "http://118.25.229.125:8888/api/v1/order/";
this.$http.get(api, {params:{token:'230d2d8dc3b64d89739afe06aca5242c'},},{emulateJSON:true}).then((response)=>{
console.log(response);
})
}
拿到数据:
![vue的练习项目(一)——vue-resourse请求数据](https://img.it610.com/image/info8/e4856b95cc7b45a0aa80ff8949a556a0.jpg)
文章图片
推荐阅读
- JavaScript|vue 基于axios封装request接口请求——request.js文件
- 前端|web前端dya07--ES6高级语法的转化&render&vue与webpack&export
- 前端开发|Vue2.x API 学习
- vue|Vue面试常用详细总结
- vue|电商后台管理系统(vue+python|node.js)
- 腾讯TEG实习|腾讯实习——Vue解决跨域请求
- Vue|vue-router 详解
- vue|vue3替代vuex的框架piniajs实例教程
- Vue|Vue3.0的插槽是如何实现的()
- 前端|面试官(谈谈Vue和React的区别())