Vue学习笔记4——Axios异步通信

什么是Axios

官方文档
Axios是一个开源的可以用在浏览器端和Node JS 的异步通信框架，它的主要作用就是实现AJAX异步通信，其功能特点如下:

• 从浏览器中创建 XMLHttpRequests
• 从node.js 创建http请求
• 支持Promise APl[JS中链式编程]
• 拦截请求和响应
• 转换请求数据和响应数据
• 取消请求
• 自动转换JSON 数据
• 客户端支持防御XSRF(跨站请求伪造)
  GitHub
  中文文档

为什么要使用Axios

由于vue.js是一个视图层框架并且作者（尤雨溪）严格准守SoC (关注度分离原则)，所以Vue.js 并不包含 AJAX的通信功能，为了解决通信问题，作者单独开发了一个名为 vue-resource的插件，不过在进入2.0版本以后停止了对该插件的维护并推荐了Axios框架。少用jQuery，因为它操作Dom太频繁!

第一个Axios应用程序

咱们开发的接口大部分都是采用JSON格式，可以先在项目里模拟一段JSON数据，数据内容如下:创建一个名为data.json的文件并填入上面的内容，放在项目的根目录下

{
  "name": "狂神说Java",
  "url": "https://blog.kuangstudy.com",
  "page": 1,
  "isNonProfit": true,
  "address": {
    "street": "含光门",
    "city": "陕西西安",
    "country": "中国"
  },
  "links": [
    {
      "name": "bilibili",
      "url": "https://space.bilibili.com/95256449"
    },
    {
      "name": "狂伸说java",
      "url": "https://blog.kuangstudy.com "
    },
    {
      "name": "百度",
      "url": "https://www.baidu.com/"
    }
  ]
}

Vue的生命周期

官方文档



前往vue学习笔记5——计算属性、内容分发、自定义事件