在 Vue js 中全局读取配置，如 Mixins

Question

我有一个棘手的要求。我想通过进行 API 调用来读取配置(例如、id、api 等(。然后我想全局保存这个值，以便我的所有 Vue 组件都可以读取这个值。

我见过混音。

但它看起来像是用于通用功能，我必须在我的组件中导入该 mixin。

如何仅执行此操作一次并直接保存所有组件的值？我认为这个例子看起来很适合我的要求，但我无法理解这是一个好方法吗？

Answer 1

Afaik，3种方法可以做到你想要的。

• 米辛
• 供应商
• Vuex

我个人更喜欢提供者，你只需要在需要时注入。它可能比混合溶液轻。

这是快速预览。

export default {
  name: 'RootComponent',
  provide () {
    let provider = {}
    Object.defineProperty(provider, 'appSettings', {
      iteratable: true,
      get: () => this.appSettings
    })
    return provider
  },
  data () {
    return {
      appSettings: {}
    }
  },
  mounted () {
    this.yourApiCall().then((result) => {
      this.$set(this.$data, 'appSettings', result)
    })
  }
}
export default {
  name: 'SubComponent',
  inject: ['appSettings'],
  mounted () {
    console.log(this.appSettings)
  }
}