我正在尝试通过Vue开玩笑地进行测试。

以下详细信息。

问题：

• 无法使用shallowMount选项安装。

情况：

1. 使用Vue-test-utils中提供的shallowMount选项安装组件后，运行测试。
2. 引发错误“无法读取未定义的属性'XXXX'

这是我的测试代码。

import myComponent from '@/~';
import Vuex from 'vuex';
import Vuelidate from 'vuelidate';
import { shallowMount,createLocalVue } from '@vue/test-utils';

const localVue = createLocalVue();
localVue.use(Vuex);
localVue.use(Vuelidate);

describe('myComponent~',() => {
  let store;

  beforeEach(() => {
    store = new Vuex.Store({
      modules: {
        user: {
          namespaced: true,getters: {
            profile: () => {
              const profile = { name: 'blahblah' };
              return profile;
            },},});
  });

  describe('profile.name is "blahblah"',() => {
    it('return something~',() => {
      const wrapper = shallowMount(myComponent,{
        localVue,store,mocks: {
          $api: {
            options: {
              testMethod() {
                return new Promise((resolve,reject) => {
                  resolve('test');
                });
              },$i18n: {
            t() {
              return {
                EN: 'EN',KO: 'KO',JP: 'JA',SC: 'zh-CN',TC: 'tw-CN',};
            },});
      expect(wrapper.find('.profile').text()).toBe('blahblah');
    });

我认为问题在于属性没有设置为指定值或像数组或对象这样的空值。

但是我不知道如何在逻辑中正确设置属性。

例如

当错误产生“无法读取未定义的属性'images'”时，

我用这样的相关方法添加到包装器中。

exampleMethod() {
 this.something = this.something.map(item => {
  if (item.detailContent.images) { // <-- the added wrapper is here
   ~~~logic~~~~
  }
 })
}

但是未定义的属性太多了，我也认为这种方式不合适。

我该如何解决这个问题？

已添加

这些是上述示例方法的详细信息：

    exampleMethod() {
      this.something = this.something.map(item => {
        let passValidation = false;
        let failValidation = false;
        if (item.detailContent.images) {
          if (this.detail.showLanguages.includes(item.code)) {
            if (this.configId !== 'OPTION1') {
              item.detailContent.images = item.detailContent.images.map(element => {
                return {
                  ...element,required: true,}
              });
            }
            checkValidationPass = true;
          } else {
            if (this.configId !== 'OPTION1') {
              item.detailContent.images = item.detailContent.images.map(element => {
                return {
                  ...element,required: false,}
              });
            }
            checkValidationPass = false;
          }
          return {
            ...item,required: passValidation,warning: failValidation,}
        }
      });
      if (this.configId === 'OPTION2') {
        this.checkOption2Validation();
      } else if (this.configId === 'OPTION3') {
        this.checkOption3Validation();
      } else {
        this.checkOption1Validation();
      }
    },

这是'this.something'：

data() {
  return {
    something: []
  }
}

在此处设置detailContent。

    setMethod() {
      this.something = [
        ...this.otherthings,];
      this.something = this.something.map(item => {
        let details1 = {};
        if (this.configId === 'OPTION2') {
          details1 = {
            images: [
              { deviceType: 'PC',titleList: [null,null],imageType: 'IMAGE' },{ deviceType: 'MOBILE',null,null] }
            ]
          };
        } else if (this.configId === 'OPTION3') {
          details1 = {
            images: [
              { deviceType: 'PC' },{ deviceType: 'MOBILE' }
            ],links: { linkType: 'EMPTY' },};
        }
        let details2 = {
          mainTitle: {
            content: null,}
        }
        let checkValidation = false;
        this.detail.detailLanguages.forEach(element => {
          if (element.language === item.code) {
            details1 = { ...element };
            if (!!element.mainTitle) {
              details2 = { ...element };
            } else {
              details2 = {
                ...details2,...element
              };
            }
            if (this.configId !== 'OPTION1') {
              details1.images = details1.images.map(image => {
                return {
                  ...image,}
              });
            }
            checkValidation = true;
          }
        });
        return {
          ...item,detailContent: this.configId !== 'OPTION1' ? details1 : details2,warning: false,}
      });
    },