Nuxt - 如何在全局混合中调用吸气剂？

Question

大家好，这里是我编写的 mixin 代码，因为我想将其用于 default.vue 和 error.vue 布局。我试图避免在两种布局中重复代码。

export default {
  provide () {
    return {
      copyRight: this.getCopyrightText,
      email: this.getEmail,
      socials: this.getSocials
    }
  },
  computed: {
    getMenu () {
      return this.store.getters['general/getMenu'].menu
    },

    getSocials () {
      return this.store.getters['general/getSocialDetails']
    },

    getCopyrightText () {
      return this.store.getters['general/getCopyRight']
    },

    getEmail () {
      return this.store.getters['general/getEmail']
    }
  },
  middleware: 'load-menu-items'
}

这是我得到的：无法读取未定义的属性 'length'

我做错了什么？

Answer 1

在您的组件中，我假设您正在对从 getter 方法接收的数据使用 .length，这可能是发生错误的地方。

首先，您应该进行调试，看看您的 getter 是否确实按预期工作。试试这个并查看控制台中每个 getter 计算出的属性的输出。如果 undefined 被打印到控制台，如果您在其上使用 .length，您将得到 post 编辑的错误

getEmail () {
  let data = this.store.getters['general/getEmail'];
  console.log(data);
  return data;
}

如果你 post 使用这个 mixin 的组件也许我可以进一步帮助你。

Nuxt - 如何在全局混合中调用吸气剂？

Nuxt - How to call a getters in a global mixins?

mixins

vue.js

vuex

nuxt.js