Why can't axios http request be used in vue2?

This time I will bring you why axios http request cannot be used in vue2, and what are the precautions to solve the problem that axios http cannot be used in vue2. The following is a practical case, let's take a look.

When using axios to handle post requests , the problem that occurs is solved

By default: axios.post(url , params).then(res => res.data);

When the url is a remote interface link, a 404 error will be reported:

Uncaught (in promise) Error: Request failed with status code 404

We need Instantiate a new axios and set its message header to 'content-type': 'application/x-www-form-urlencoded'

So the solution is:

var instance = axios.create({
 headers: {'content-type': 'application/x-www-form-urlencoded'}
});
instance .post(`url`, params).then(res => res.data);

Then I found that no error was reported, but the background could not accept the incoming parameters. After consulting the information, I found that a qs module needed to be introduced

var qs=require('qs');
var instance = axios.create({
 headers: {'content-type': 'application/x-www-form-urlencoded'}
});
instance .post(`url`, qs.stringify(params)).then(res => res.data);

Done!

problem solved!

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

Detailed explanation of the use of deep and shallow copy of JS

Display of http request and loading in Vue2.0

The above is the detailed content of Why can't axios http request be used in vue2?. For more information, please follow other related articles on the PHP Chinese website!