在axios中如何實現全域註冊

這篇文章主要給大家介紹了關於axios如何全局註冊的相關資料，文中透過範例程式碼介紹的非常詳細，對大家學習或使用axios具有一定的參考學習價值，需要的朋友們下面一起學習學習吧。

前言

最近用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:&#39;app&#39;,
 data(){
  return{
   msg:&#39;hello&#39;
  }
 },
 methods:{
  send(){
   // 注意：因为 axios 是加到 Vue 的原型中了，所以使用 axios 方法时，前面需要加 this
   this.axios.get(&#39;https://www.baidu.com*******&#39;)
   .then(resp => {
    console.log(resp.data)
   }).catch(err => {
    console.log(err);
   })
  }
 }
}
</script>

上面是我整理給大家的，希望今後會對大家有幫助。

相關文章：

在vue中使用vue-cli如何建立helloWorld

layui中有關取值傳值方面的問題

使用JavaScript如何實作抽獎系統

#詳細解答vue的變化對元件有什麼影響？

使用Parcel如何打包

詳細解讀Vue如何設定打包工具

以上是在axios中如何實現全域註冊的詳細內容。更多資訊請關注PHP中文網其他相關文章！