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

11-21 21阅读 0评论

axios?=

什么是axios

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

axios发起Get请求

axios发起get请求的语法

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

代码

<body> <button ID="btn1">发起get请求</button> <script> document.queryselector('#btn1').addEventlistener('click', functiON () { let URL = 'http://www.liulongbin.top:3006/API/get'; axios.get(url, { params: { name: 'xiaoxie', age: '20' } }).then(function (res) { console.log(res.data); }) }) </script> </body>

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

axios发起Post请求

axios发起post请求的语法

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

 <button id="btn2">发起post请求</button>   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发起Ajax请求(最新推荐)

直接使用axios发起get请求

axios也提供了似于Jquery中$.AJAX()的函数,语法如下:

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

<body> <button id="btn3">发起ajax请求</button> <script> document.getElementById('btn3').addEventListener('click', function () { let url = 'http://www.liulongbin.top:3006/api/get'; let paramsData = { name: 'xiaoxie', age: 20 } axios({ method: 'get', url: url, params: paramsData, }).then( function (res) { console.log(res.data); } ) }) </script> </body>

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

直接使用axios发起post请求

<body> <button id="btn4">发起Ajax post请求</button> 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); } ) }) </script> </body>

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

到此这篇关于如何通过axios发起Ajax请求的文章就介绍到这了,更多相关axios发起Ajax请求内容请搜索云初冀北以前的文章或继续浏览下面的相关文章希望大家以后多多支持云初冀北!

免责声明
本站提供的资源,都来自网络,版权争议与本站无关,所有内容及软件的文章仅限用于学习和研究目的。不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负,我们不保证内容的长久可用性,通过使用本站内容随之而来的风险与本站无关,您必须在下载后的24个小时之内,从您的电脑/手机中彻底删除上述内容。如果您喜欢该程序,请支持正版软件,购买注册,得到更好的正版服务。侵删请致信E-mail:Goliszhou@gmail.com
$

发表评论

表情:
评论列表 (暂无评论,21人围观)

还没有评论,来说两句吧...