Vuejs2.0学习笔记之axios&vue-resource

  1. 在Vue中发送AJAX请求:Vue自己并不支持发送ajax请求,须要使用第三方插件vue-resources(1.0, 可是2.0中不建议使用)、官方推荐使用axis(2.0);可是也能够用jQuery;
  2. 什么是axios?axios是一个基于promise的http请求客户端,用来发送请求,也是vue2.0官方推荐使用的;在vue2.0官方推荐的,同时再也不对vue-resource进行更新和维护。
  3. axios的github地址和使用方式:https://github.com/axios/axios
  4. 使用axios说明:
axios([options])  
axios.get(url[,options]);
    传参方式:
        1.经过url传参
        2.经过params选项传参
axios.post(url,data,[options]);
    axios默认发送数据时,数据格式是Request Payload,并不是咱们经常使用的Form Data格式,
    因此参数必需要以键值对形式传递,不能以json形式传参
    传参方式:
        1.本身拼接为键值对
        2.使用transformRequest,在请求发送前将请求数据进行转换
        3.若是使用模块化开发,能够使用qs模块进行转换
 
axios自己并不支持发送跨域的请求,没有提供相应的API,做者也暂没计划在axios添加支持发送跨域请求,因此只能使用第三方库
  1. 如何解决跨域问题:
    • 客户端经过jsonp或者vue-resource支持: vue-resource帮助文档
    • 若是服务端经过CORS支持跨域,则客户端不须要处理跨域
使用vue-resource的this.$http发送请求:
    this.$http.get(url, [options])
    this.$http.head(url, [options])
    this.$http.delete(url, [options])
    this.$http.jsonp(url, [options])
    this.$http.post(url, [body], [options])
    this.$http.put(url, [body], [options])
    this.$http.patch(url, [body], [options])

事例:输入github的uid,经过github提供的api来获取name和avatar.vue

相关文章
相关标签/搜索