axios全局使用

1,723 阅读1分钟

vue中我们常用axios进行数据请求

axios模块在vue开发中如何使用引入,如何注册全局方法

一般情况下我们采用如下方法

import axios from 'axios'
 axios({
  url:'http://www.baidu.com',
})
.then(res=>{
  console.log(res)
})

这是vue中比较提倡的引入方法

但是每个数据请求页面都需要引入axios方法会感到一定的繁琐

如何引入全局axios呢

在main.js中 先引入axios

 import axios from 'axios'

好 接下去使用原型的定理 将axios方法设定为Vue对象的方法

 Vue.prototype.axios=axios

这里需要注意的是 此时axios是Vue实例中的方法了 方法必须为对象调用 #所以我们在实例中使用的时候一定要加上this或者是实例对象名
mounted(){ this.axios({ url:'www.baidu.com', method:'get' }) .then(res=>{ console.log(res) }) }

此时我们就可以在任何组件里调用axios方法了

不过还是推荐按需引入axios比较好哦