Anwendungsweite globale Variablen in vue.js

Question

Hat Vue.js eine idiomatische Möglichkeit, anwendungsweite Globals wie baseUrl zu deklarieren und sie dann in der gesamten App zu referenzieren (für API-Aufrufe usw.)?

Wenn ja, was ist der beste Weg, solche Globals zur Build-Zeit zu konfigurieren, um Entwicklungs-, Test- und Prod-Instanzen zu erstellen? Zum Beispiel stelle ich mir vor, export BASEURL='http://dev.myapp.com' zu machen, einen Build auszuführen und eine App mit dieser BaseUrl zu konfigurieren. Dies würde mir wiederum ermöglichen, automatisierte Builds für die kontinuierliche Lieferung zu erstellen, wobei bestimmte Zweige aktualisiert werden (develop ->dev.myapp.com, master ->www.myapp.com usw.).

Danke!

Answer 1

Was ich tue: Verwenden Sie ein Tool zur Zustandsverwaltung, z. B. Vuex.

Wenn Sie nicht die Komplexität Ihrer Anwendung hinzufügen möchten, verwende ich ein Elternteil Vue Beispiel lassen Sie App.vue sagen und globalen Daten in diesem Fall definieren, dann, wenn ich brauche, dass die Daten von der übergeordneten I this.$root.baseUrl im Falle rufen Sie will die baseUrl. Beachten Sie, dass Sie auch this.$parent.baseUrl aufrufen können, aber dies funktioniert nur für direkte Kinder, wenn Sie in einem Kind eines Kindes sind, erhalten Sie nicht die globalen Daten, deshalb ist das $root Objekt besser.