Thirteen, axios framework learning

One, the basic use of axios

1.1 Install axios

Excuting an order:npm install axios --save
Insert picture description here

1.2 Send a get request demo

Insert picture description here
Insert picture description here

1.3 Send concurrent requests

Sometimes, we may need to send two requests at the same time

  • Using axios.all, you can put multiple request arrays.
  • The result returned by axios.all([]) is an array. Use axios.spread to expand the array [res1,res2] into res1, res2

Insert picture description here
Insert picture description here
Insert picture description here
Insert picture description here

1.4 Global configuration

In the above example, our BaseURL is fixed

  • In fact, many parameters may be fixed during development.
  • At this time, we can perform some extraction, or use the global configuration of axiox
  • Insert picture description here
    Insert picture description here

1.5 Common configuration options

Insert picture description here

1.6 Examples of axios

Why create an instance of axios?

  • When we import objects from the axios module, the instance used is the default instance.
  • When some default configurations are set for this instance, these configurations are fixed.
  • However, in subsequent development, some configurations may be different.
  • For example, some requests need to use a specific baseURL or timeout or content-Type, etc.
  • At this time, we can create a new instance and pass in the configuration information belonging to the instance.
    Insert picture description here

Insert picture description here

1.7 axios package

The first way: the
Insert picture description here
second way: the
Insert picture description here
third way: the
Insert picture description here
fourth way (master):
Insert picture description here

1.8 How to use an interceptor?

  • Axios provides an interceptor for us to perform corresponding processing after sending each request or getting the response.
  • How to use an interceptor?
    Insert picture description here

Guess you like

Origin blog.csdn.net/weixin_44827418/article/details/114916730