本文介绍了如何在Vue项目中使用axios进行网络请求。首先讲解了axios的基本功能和用法，包括导入axios并创建全局对象，以及通过then方法处理响应。接着，通过示例展示了GET和POST两种请求方式。在Vue应用中，由于回调函数内的this指向改变，需要保存this引用以正确操作Vue实例的数据。最后，阐述了解决回调函数中this问题的方法，确保数据能够正确绑定到视图上。
1 axios
axios：功能强大的网络请求库
导入：
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>导入后，就会注册一个axios全局对象，可以通过它发送请求了。
语法：
axios.get("url地址")
.then(function(response)
{
},function(err){
}
)then方法中的回调函数会在请求成功或失败时候触发，通过回调函数的形参可以获取响应内容或者错误信息。
例子：
两个接口，一个get，一个post
<body>
<!--准备一个被vue挂载的容器div-->
<div id="app">
<input type="button" value="get请求" class="get"/>
<input type="button" value="post请求" class="post"/>
</div>
<script>
/* 接口1 随机笑话
请求地址:https://autumnfish.cn/api/joke/list
请求参数:num(笑话条数)
响应内容:随机笑话
*/
最低0.47元/天 解锁文章
7209
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
