Vue прототип Axios

Question

Я новичок в Vue и Quasar.

Теперь у меня есть как Vue работает неопределенно,

Я пытался понять шаблонный код, который мы получаем при запуске Quasar

Во время инициацииЯ попросил его интегрировать axios и veux из cli

Теперь я пытался разобраться с плитой котла, которая наткнулась на файл axios.jsвнутри папки плагина

Файл содержит следующий код

import axios from 'axios'

export default ({ Vue }) => {
  Vue.prototype.$axios = axios
}

1. Может кто-нибудь сказать мне, что делает этот код?Исходя из моего понимания, кажется, что он добавляет метод к vue, известный как axios , чтобы мы могли использовать его глобально?

2. В чем может быть причина для использования $axios?то есть Vue.prototype.$axios = axios, мы не можем просто сделать Vue.prototype.axios = axios?так как это в конечном итоге создает свойство?

3. Если мы можем использовать axios глобально (без импорта или другими словами, написав import axios from "axios").Тогда как мы можем это сделать?

4. Я предполагаю, что это будет работать только для .vue файла?

5. Я привык к созданию вспомогательной функциигде я делаю все сетевые запросы, обычно файл вспомогательной функции будет networkRequest.js, где я буду импортировать axios и делать запросы.Это networkRequest.js является единственной точкой, из которой сделаны все запросы.Так как Vue.prototype.$axios = axios будет работать только с файлом .vue?Имеет ли смысл использовать плагин axios, который входит в комплект поставки

Answer 1

1. Да, вы правы.Он создает глобальный экземпляр axios, который доступен для всех компонентов Vue.Таким образом, вместо импорта axios в несколько файлов и создания нескольких его экземпляров вы можете создать ОДИН экземпляр и объединить все общие свойства для этого экземпляра.Например, вы можете определять перехватчики и URL-адреса в одном месте, а не распределять их повсюду.

2. Vue очень хорошо это определяет на своем сайте

Никакой магии здесь не происходит.$ - это соглашение, которое Vue использует для свойств, доступных для всех экземпляров.Это позволяет избежать конфликтов с какими-либо определенными данными, вычисленными свойствами или методами.

Вы можете сделать это несколькими способами.Если вы находитесь в файле .vue, вы можете напрямую получить к нему доступ через this.$axios().Если вы хотите получить к нему доступ через хранилища Vuex, вам нужно либо передать контекст компонента, либо вы можете использовать его в файлах JS import Vue from 'vue' и использовать его как Vue.prototype.$axios()

Он также будет работать в файлах JS.Выполните шаг в номер 3.

См. Номер 4.