axios 获取后台数据

什么是axios

  • axios是一个获取后台数据的插件
  • 地址https://www.npmjs.com/package/axios
  • 使用 前提得安装node.js
  • 页面直接引用 <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  • 下载 选中文件夹 shift+右键 调出命令窗口 输入 npm i axios -g

axios的特性

1.可以从浏览器中创建XHR对象
2、可以从nodeJS中创建HTTP请求
3、支持Promise
4、可以拦截请求和响应
5、可以转换请求数据和响应数据
6、可以取消请求
7、可以自动转换JSON数据
8、客户端支持防御XSRF

获取数据:
路径为后台数据接口
在用axios获取后台数据时,
  get  function(){
      var url = '路径'
    axios.get(url,{params:参数}).then(function(储存后台数据的变量:A){    //then为成功后的回调
        对象名.渲染页面的函数名(A.data)                     // data是在使用axios的时候,axios给数据添加了一个data来封装获得的数据,
    }).catchcatch(function (用来储存错误信息的变量:error){ // 捕捉错误
      alert(error)                                        // 请求失败之后,执行这个函数
    })
    }
  • axios get 方法
    仅仅请求后台数据
axios.get('index.php')
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

带参数请求后台数据

axios.get('/user', {
    params: {
      ID: 12345
    }
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

当然,也可以把参数数据直接写到URL中

// 为给定 ID 的 user 创建请求
axios.get('/user?ID=12345')
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });
  • aixos post方法
    一般来说,post请求更多的是要提交数据,params属性里的数据会出现在请求主体中。
    [注意]如果是axios.create()方法中的params属性,则其里面的数据会出现在URL参数中。
    但实际上,post方法不需要使用params属性,它的第二个参数就是要发送的数据。
axios.post('/user', {
    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) {
    // acct为第一个请求的结果,perms为第二个请求的结果
  }));
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容