Vue中Http请求的那些坑 【转载】

1.不支持http请求

表现为：程序启动正常，点击按妞不跳转，后台无响应，浏览器调试出现

Uncaught TypeError: Cannot read property 'post' of undefined

解决办法：添加vue-resource支持，在main.js添加

import VueResource from 'vue-resource'
Vue.use(VueResource);

2.post请求，后台接收参数为null

表现为：后台响应但是参数为null，正确的登陆失效，调试时，参数为from object

解决办法：http请求中，添加

{emulateJSON:true}

全部的Http请求部分代码为

_this.$http.post('http://localhost:8080/person/login', {
 username: _this.username,
 password: _this.password
 }
 ,{emulateJSON:true}
 )
 .then(function (response) {
 var errorcode = response.data.code;
 if (errorcode == "200") {
 _this.$router.push(
 { path: '/HelloWorld',
 query: {
 user: response.data.data,
 }
 });
 } else {
 _this.$router.push({ path: '/Fail' });
 }
 })
 .catch(function (error) {
 console.log(error);
 });

3、正确处理后，跳转到空页面

原因：路由的url配置有问题，注意组件的引用的对应关系以及path的路径问题

4.Request请求变成Options

解决办法：设置头格式

 http: {
 headers: {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'}
 },

转载时请注明出处及相应链接，本文永久地址：https://blog.yayuanzi.com/24554.html

微信打赏

支付宝打赏