加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

vue axios用法教程详解

发布时间:2020-12-17 02:52:09 所属栏目:百科 来源:网络整理
导读:axios是vue-resource后出现的Vue请求数据的插件。vue更新到2.0之后,作者尤大就宣告不再对vue-resource更新,而是推荐的axios。 下面我们来使用axios 这时候如果在其它的组件中,是无法使用 axios 命令的。但如果将 axios 改写为 Vue 的原型属性,就能解决这个

axios是vue-resource后出现的Vue请求数据的插件。vue更新到2.0之后,作者尤大就宣告不再对vue-resource更新,而是推荐的axios。

下面我们来使用axios

这时候如果在其它的组件中,是无法使用 axios 命令的。但如果将 axios 改写为 Vue 的原型属性,就能解决这个问题

1 1. Vue.prototype.$ajax=axios

好像还有另外一种方法,是不需要去修改Vue的原型的,那就是我们除了npm install安装axios依赖以外,再去安装一个vue-axios

import Vueaxios from "vue-axios"

 我都是用第一种方法的,这种没试过,有兴趣大家可以去试试。

在 main.js 中添加了这两行代码之后,就能直接在组件的 methods 中使用 $ajax 命令

  上述只是写了发起请求,并没有请求返回数据的回调。

  这是axios的回调函数,.then为请求成功的回调函数,而.catch为请求失败的回调函数

  这两个回调函数都有各自独立的作用域,如果直接在里面访问 this,无法访问到 Vue 实例,怎么办嘞????

  只要添加一个 .bind(this) 就能解决这个问题

以上所述是小编给大家介绍的vue axios用法教程详解,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读