首页 > web前端 > js教程 > 正文

vue.js中Axios的概念以及使用方法

零到壹度
发布: 2018-04-12 14:12:52
原创
2516 人浏览过

本篇文章给大家分享的内容是vue.js中Axios的概念以及使用方法,有着一定的参考价值,有需要的朋友可以参考一下

    1.什么是Axios

   https://www.kancloud.cn/yunye/axios/234845这是官方中文文档,大家可以看看

  Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。跟ajax一样都会是用来与后台交互的,但两者之间又有着区别

 以下是知乎上的一段话:

axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。

 简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。

   axios是ajax    ajax不止axios,这段话可以很好地诠释两者之间的关系

juuery ajax主要是针对mvc的编程,越来越跟不上现在的节奏了,而且juuery太大,单独为了ajax而引入jquery有点得不偿失,随着越来越多的框架的崛起,jquery的路有些越走越窄

axios具有以下特点

                 从 node.js 创建 http 请求

                  支持 Promise API客户端

                  支持防止CSRF

                   提供了一些并发请求的接口(重要,方便了很多的操作)

                  相对于ajax,axios更小巧

说了这么多,大家应该也理解了,两者之间的区别,那么接下来就给大家介绍一下具体用法

            先来看一段代码                 

axios({
    method: 'post',
    url: '/user/12345',
    data: {
        firstName: 'Fred',
        lastName: 'Flintstone'
    }
})
.then(function (response) {
    console.log(response);
})
.catch(function (error) {
    console.log(error);
});
登录后复制

对于浏览器的支持


同事支持多个请求

function getUserAccount() {
  return axios.get('/user/12345');
}

function getUserPermissions() {
  return axios.get('/user/12345/permissions');
}

axios.all([getUserAccount(), getUserPermissions()])
  .then(axios.spread(function (acct, perms) {    
  // 两个请求现在都执行完成
  }));
登录后复制

如何安装呢

使用 npm :

        $ npm install axios
登录后复制

使用 bower:

        $ bower install axios
登录后复制

使用 cdn:

        <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
登录后复制

以上是vue.js中Axios的概念以及使用方法的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!