如何通过axios发起Ajax请求(最新推荐)

Axios是专注于网络数据请求的库，相比于原生的XMLHttpRequest对象，axios简单易用。相比于Jquery，axios更加轻量化，只专注于网络数据请求，这篇文章主要介绍了如何通过axios发起Ajax请求,需要的朋友可以参考下

axios

什么是axios

Axios是专注于网络数据请求的库，相比于原生的XMLHttpRequest对象，axios简单易用。相比于Jquery，axios更加轻量化，只专注于网络数据请求。

axios发起GET请求

axios发起get请求的语法：

在这里插入图片描述

代码

在这里插入图片描述

axios发起POST请求

axios发起post请求的语法

在这里插入图片描述

  document.querySelector('#btn2').addEventListener('click', function () { let url = 'http://www.liulongbin.top:3006/api/post'; axios.post(url, { name: 'xiaoxie', age: '20' }).then(function (res) { console.log(res.data); }) })

在这里插入图片描述

直接使用axios发起get请求

axios也提供了类似于Jquery中$.ajax()的函数，语法如下：

在这里插入图片描述

直接使用axios发起post请求

  document.getElementById('btn4').addEventListener('click', function () { let url = 'http://www.liulongbin.top:3006/api/post'; let paramsData = { name: 'xiaoxie', age: 20 } axios({ method: 'post', url: url, data: paramsData, }).then( function (res) { console.log(res.data); } ) })

在这里插入图片描述