Learn how to use axios (ajax) in one minute + avoid pitfalls

1. The role of axios

1 Introduction

  Axios is actually a simplified way of writing ajax, and its essence is the same as ajax. And ajax (Asynchronous JavaScript And XML) is actually asynchronous javaScript and XML.

2. Function

  In a simple sentence, it is "connect to the database (backend) through axios in html".
  Its biggest feature is that you can access the backend without jumping.

2. How to use axios

1. Direct writing method

  First, when we want to use axios, we must import it first, as shown in the following code:

   <script src="axios-0.18.0.js"></script>

*Supported files Baidu Netdisk:
    Link: https://pan.baidu.com/s/1mS6S7vr0T9g0VjWrEXkhFg?pwd=njjx
    Extraction code: njjx
https://pan.baidu.com/s/1mS6S7vr0T9g0VjWrEXkhFg?pwd=njjx
  Then, we In the back-end code, the core is the request and response; in the request, there are get request method and post request method, so when axios accesses the back-end server, it is divided into these two situations: get
   :

  axios({
    method:"get",
      /!*此处记得是服务器地址*!/
    url:"http://localhost:8088/_06_Ajax_war_exploded/AxiosServlet?username=zhangkun"
  }).then(function (resp){  // resp可以获取到响应的值
      alert(resp.data);
  })

   post

    axios({
        method:"get",
        url:"http://localhost:8088/_06_Ajax_war_exploded/AxiosServlet?",
        data:"username=zhangkun"  /*与get不同之处：参数通过data传*/
    }).then(function (resp){
        alert(resp.data);
    })

2. Variation

  get：

axios.get("http://localhost:8088/_06_Ajax_war_exploded/AxiosServlet?username=zhangkun")
        .then(function (){
            alert(resp.data);
        })

  post：

    axios.post("http://localhost:8088/_06_Ajax_war_exploded/AxiosServlet","username=zhangkun")
        .then(function (){
            alert(resp.data);  
        })