这篇文章主要介绍了vue利用axios来完成数据的交互,本文通过实例代码给大家讲解数据交互方法及安装方法,需要的朋友可以参考下
axios基于 Promise 的 HTTP 请求客户端，可同时在浏览器和 node.js 中使用
现在Vue官方推荐的网络通信库不再是vue-resource了，推荐使用axios。所以学习了下，总结如下。
一、功能特性
1、在浏览器中发送 XMLHttpRequests 请求
2、在 node.js 中发送 http请求
3、支持 Promise API
4、拦截请求和响应
5、转换请求和响应数据
6、自动转换 JSON 数据
7、客户端支持保护安全免受 XSRF 攻击
二、axios的安装方法（官方给了3种方法）
1、npm安装
$ npm install axios
2、bower安装
$ bower install axios
3、直接使用cdn
三、安装步骤
这里我使用npm的方法步骤：
①首先在npm中输入npm install axios
②在main.js加上配置
import axios from ‘axios' Vue.prototype.$http = axios
四、请求实例
点击获取数据可以取到想要的数据
<div class="tabbar"> <p>首页</p><button>获取数据</button><div class="new_wrap"> <div class="newcard"> <div> <p>{{items.issuer_nickname}}.</p></div><div> {{items.title}} </div><div class="pic"> </div></div><br></div></div><!-- Add "scoped" attribute to limit CSS to this component only --> *{margin: 0;padding: 0;} @function torem($px){//$px为需要转换的字号 @return $px / 100px * 1rem; //100px为根字体大小 } ul{ width: 100%; position: absolute; bottom: 0; li{ width: torem(187.5px); float:left; height: torem(98px); text-align:center; ba<b style="color:transparent">本文来源gao@!dai!ma.com搞$$代^@码!网!</b>ckground: #ccc; } } img{ width: torem(200px); height: torem(200px); }
效果图：
参考网址：https://github.com/axios/axios
总结
以上就是vue利用axios来完成数据的交互的详细内容，更多请关注gaodaima搞代码网其它相关文章！
搞代码网（gaodaima.com）提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接：vue利用axios来完成数据的交互
转载请注明原文链接：vue利用axios来完成数据的交互
