最近用 Vue 写项目的时候,用到 axios ,因为 axios 不能用 Vue.use() ,所以在每个 .vue 文件中使用 axios 时就需要 import.vue 文件少的话还好说,多的话未免有点麻烦。

后来想了想,能不能直接把 axios 加到 Vue 的原型中,这样就达到了全局注册了。

1. 首先在 main.js 中引入 axios
import Vue from 'vue'
import axios from 'axios'
//把 `axios` 加到 `Vue` 的原型中
Vue.prototype.axios = axios;
new Vue({
el: '#app',
render:h => h(App)
})

2. 在 .vue 文件中使用时,注意 axios 前要加 this

<script>
export default {
name:'app',
data(){
return{
msg:'hello'
}
},
methods:{
send(){
// 注意:因为 axios 是加到 Vue 的原型中了,所以使用 axios 方法时,前面需要加 this
this.axios.get('https://www.baidu.com*******')
.then(resp => {
console.log(resp.data)
}).catch(err => {
console.log(err);
})
}
}
}
</script>

转: https://www.jianshu.com/p/12ede8685eea

Vue的axios如何全局注册的更多相关文章

  1. vue组件局部与全局注册的区别

    //局部注册 var mycomponent = new extend({        <!--Vue.extend()是Vue构造器的扩展,调用Vue.extend()我们将创建一个组件构造 ...

  2. vue项目组件的全局注册

    在vue-cli项目中,我们经常会封装自己的组件,并且要在多个界面中引用它,这个时候就需要全局注册组件. 首先我们会封装自己的组件,比如twoDimensionTable文件夹下的index.vue: ...

  3. 第七十一篇:Vue组件的私有和全局注册

    好家伙, 1.组件的父子关系 我们封装三个组件,分别为left组件,right组件和App组件 在封装时: 在封装时,彼此的关系是独立的,并不存在父子关系 在使用时: 在使用时,根据彼此的嵌套关系,形 ...

  4. [Vue]使用axios实现ajax请求

    1.定义myAjax export const myAjax=function createHttpClient(ajaxConfig) {   let httpClient = null;   if ...

  5. Vue 局部组件和全局组件的使用

    <template> <div id="app"> <!--<img alt="Vue logo" src="./ ...

  6. NO--09今天遇到的一点小问题之axios全局注册

    今天用 Vue 写项目的时候,用到 axios ,因为 axios 不能用 Vue.use() ,所以在每个 .vue 文件中使用 axios 时就需要 import , .vue 文件少的话还好说, ...

  7. Vue 全局注册逐渐 和 局部注册组件

    //定义一个名为 button-counter 的新组件 Script: Vue.component('button-counter',{//button-counter 这个是组件的名字 data: ...

  8. vue 组件 全局注册和局部注册

    全局注册,注册的组件需要在初始化根实例之前注册了组件: 局部注册,通过使用组件实例选项注册,可以使组件仅在另一个组件或者实例的作用域中可用: 全局组件 js Vue.component('tab-ti ...

  9. vue全局注册与局部注册的写法

    vue全局注册是每个实例化的vue都可以使用,而局部则是实例化注册的那个可以用.举个例子,看看写法: <div id="app"> <p>页面载入时,inp ...

随机推荐

  1. py网络编程学习笔记

    一.异常处理 异常就是程序运行时发生错误的信号(在程序出现错误时,则会产生一个异常,若程序没有处理它,则会抛出该异常,程序的运行也随之终止),在python中,错误触发的异常如下 而错误分为两种: 1 ...

  2. Mycat学习-单独启动mycat

    Mycat下载地址:http://mycat.io/ Mycat安装:解压缩即可.   Mycat作为一个中间件,实现mysql协议,是可以不依赖数据库单独运行的. 对前端应用连接来说就是一个数据库, ...

  3. Linux安装java环境和maven

    安装OpenJDK软件包: apt-get install openjdk-8-jdk 查看版本信息java -version 则代表安装成功 安装maven可以使用自己本机下载好的mavan使用Xf ...

  4. 查看安装的centos的操作系统版本

    cat /etc/redhat-release CentOS Linux release 7.6.1810 (Core)

  5. FastDateFormat日期工具类

    原文:https://blog.csdn.net/u013823538/article/details/80197476 public class DateUtil { public static f ...

  6. Spring Security 流程

    首先创建4个类 流程大致如下: 1.容器启动 加载系统资源与权限列表(HashMap) MyInvocationSecurityMetadataSourceService中的loadResourceD ...

  7. 前端学习笔记--CSS3

    本本记录了css3的样式:浏览器支持度.圆角边框.阴影.文字与文本.过渡.动画.2d旋转.3d旋转 浏览器支持度: 1.圆角边框 例:只要确定了x.y值,就能知道弧度 画一个圆形:长=宽,border ...

  8. Fiddler抓包工具(捕获Android数据包)

    一:获取Android的数据包必须要在同一个网络中 移动设备访问网络原理 先看看移动设备是怎么去访问网络,如图所示,可以看到,移动端的数据包是从wifi出去的. 可以看得出,移动端的数据包,都是要走w ...

  9. 【安卓基础】ViewPager2的入门使用

    之前的项目中使用过ViewPager,被坑过几次.如果你在RecyclerView中的Item使用ViewPager,你绝对会产生莫名其妙的问题,因为ViewPager在同一界面上不能有两个一样的ID ...

  10. DNSMAQ 搭建 DNS 服务

    DNSmasq是一个小巧且方便地用于配置DNS和DHCP的工具,适用于小型网络,它提供了DNS功能和可选择的DHCP功能.自己搭建公共DNS更加灵活,如果是在本地搭建,还可以大幅提高解析速度. 相比较 ...