vue.js - 将 props 数据绑定到全局 mixin

Question

我有来自 getter 的数据的全局混合，例如：

我想在所有组件上绑定“currentTheme”，其中一个名为“theme”的道具

我想我需要 hook beforeMount，因为在以前的 hooks 中我不能使用计算数据

import Vue from "vue";

import { mapGetters } from "vuex";

Vue.mixin({
  computed: {
    ...mapGetters({
      currentTheme: "getCurrentTheme"
    })
  },
  beforeMount() {}
});

我怎样才能做得更好并具有反应性？

Answer 1

在created钩子中检查组件是否有theme道具。如果有，则$set值为currentThemeto this.$data。

import Vue from "vue";

import { mapGetters } from "vuex";

Vue.mixin({
  created() {
    if (this.$options._propKeys.includes("theme")) {
      this.$set(this.$data, "key", this.$store.getters.getCurrentTheme);
    }
  }
});

对于以下内容props：

this.$options._propKeys看起来像这样：