说明:
我们项目现在用的是:vue2.0 + vue-cli + webpack + vue-router2.0 + vue-resource1.0.3
如果大家在实践的过程中与本文所说的内容有较大区别的话看看是不是版本问题。
本文是一系列文章,在我对Vue有了更深刻的理解认识之后会对文章及时进行修改或更正,欢迎大家批评指出错误。以下是已完成的文章列表。
1. Vue.js系列之项目搭建(1)
2. Vue.js系列之项目结构说明(2)
3. Vue.js系列之vue-router(上)(3)
4. Vue.js系列之vue-router(中)(4)
5. Vue.js系列之vue-router(下)(5)
概述
前面五篇文章我们已经从简单的项目搭建到清楚项目结构,以及详细介绍了vue-router官方插件,现在我们要实现项目的动态数据交互,就要用到接口请求插件vue-resource,它不是Vue官方维护的插件,但是使用是最多的,它可以通过XMLHttpRequest或JSONP发起请求并处理响应。vue-resource有非常简洁的API,还提供了非常有用的inteceptor(拦截器)功能,使用inteceptor可以在请求前和请求后附加一些行为,比如使用inteceptor在ajax请求时显示loading界面。下面我们就要了解一下吧。
项目地址:https://github.com/pagekit/vue-resource
一.vue-resource特点
vue-resource插件具有以下特点:
1. 体积小
vue-resource非常小巧,在压缩以后只有大约12KB,服务端启用gzip压缩后只有4.5KB大小,这远比jQuery的体积要小得多。
2. 支持主流的浏览器
和Vue.js一样,vue-resource除了不支持IE 9以下的浏览器,其他主流的浏览器都支持。
3. 支持Promise API和URI Templates
Promise是ES6的特性,Promise的中文含义为“先知”,Promise对象用于异步计算。 URI Template