尝试测试 vue 组件时如何使用 getter 解决此错误？答案

【问题标题】：How I can resolve this error with getters when trying test vue component?尝试测试 vue 组件时如何使用 getter 解决此错误？
【发布时间】：2019-05-27 02:59:49
【问题描述】：

当我尝试测试 ModUsuario.vue 组件时，我遇到了与“getters”相关的错误。

GitHub 存储库：https://github.com/SergioFerrera/jest_vuejs

错误代码：

TypeError: Cannot read property 'getters' of undefined

ModUsuario.vue

<script>
export default {
  data() {
    return{
    }
  },
  created(){
  },
  computed: {
    getName() {
      return this.$store.getters.name
    },
    getSurname() {
      return this.$store.getters.surname
    },
    getBirthdate() {
      return this.$store.getters.birthdate
    },
    getGenre() {
      return this.$store.getters.genre
    },
    getEmail() {
      return this.$store.getters.email
    }
  }
}
</script>

modusuario.test.js

import { mount } from 'vue-test-utils'
import ModUsuario from "../../src/app/components/ModUsuario.vue";

describe("ModUsuario.vue", () => {    
  const wrapper = mount(ModUsuario);

【问题讨论】：

标签： javascript vue.js jestjs vue-test-utils

【解决方案1】：

我已经查看了您的存储库。 Here 你正在从文件夹 store 中导入 store，这个文件夹不在 repo 中。还有一些关于你的代码的建议——最好使用mapGetter helper——这样你就可以避免许多相同的计算属性。

另外一个好的做法是拆分代码 vue app index.js - 路由应该在单独的文件中。

还可以阅读所有组件的全局导入。最好将它们导入您需要的地方。因为你做的方式 - 你的 js 代码的起始量会很大

【讨论】：