TypeError: Cannot read properties of undefined (reading 'id')

回答 4 浏览 52.1万 2021-08-27

我的终端机出现了这个错误。

TypeError: Cannot read properties of undefined (reading 'id')

我试图测试对一个API的调用,但出现了错误。

我的方法:

itemToForm = () => {
    this.api.send(this.component, 'get',
        { lang: 'ES', filter: { id: this.item['id'] } }
    ).then(resEsp => {
        this.item = resEsp['data'][0];
        this.api.send(this.component, 'get',
            { lang: 'EN', filter: { id: this.item['id'] } }
        ).then(res => {
            let itemEng = res['data'][0];
            let fields = this.formDef.map(register => register.filter(
                field => field['register_table'].indexOf('traduction') !== -1
            ).map(
                field => field['field_name'])
            ).filter(register => register.length);

            fields = fields.length ? fields[0] : [];

            if (itemEng) {
                this.item = Object.keys(itemEng).reduce((obj, key) => {
                    obj[key] = this.item[key];
                    if (fields.indexOf(key) !== -1) {
                        obj[key + '_eng'] = itemEng[key];
                    }
                    return obj;
                }, {});
            }

            if (this.item) {
                this.setForm();
            }
        })
    })
}

我的规范性文件:

it('should call api.send', () => {
    let spy1 = spyOn(api, 'send');
    let item = {
        id: 1,
        name: 'test',
    }

    component.addItem(item);
    component.itemToForm();

    expect(spy1).toHaveBeenCalled();
});
David Angarita 提问于2021-08-27
在你的代码段的第2行中,似乎this.item还没有被初始化。或者resEsp['data']不包含任何元素,因此this.item = resEsp['data'][0];将再次把this.item设置为未定义,这将在你的代码段的第4行抛出一个错误。derpirscher 2021-08-27
index.ts文件也可能是罪魁祸首。尝试直接导入(不使用index.ts文件),看看错误是否解决了。Wolf359 2021-09-25
4 个回答
#1楼 已采纳
得票数 23

怎么了:

函数itemToForm()this.item准备好之前就被调用了。

有很多策略可以避免这个错误。一个非常简单的策略是在函数的开头添加一个捕捉器,就像这样。

itemToForm = () => {
  if(this.item === undefined) {return}
         
  // The rest of the code
}

如果数据还不存在,这就停止了该函数。

一个更优雅的解决方案可能是在你的操作顺序中更进一步,找到谁在调用itemToForm(),并在调用之前确保数据的存在。

Izzi 提问于2021-09-22
Peter Mortensen 修改于2021-10-17
很完美!在Vue上--使用Vuetify--当我们使用watch时,这个问题发生在库内。你的解决方案可以解决这个问题。谢谢!Michel Fernandes 2022-04-29
#2楼
得票数 11

我撞到了这个问题,但我的问题实际上是完全不同的东西。

在我的代码中,由于某些原因,我有

import { SOME_OBJECT } from '.';

而应该是这样的。

import { SOME_OBJECT } from './proper-file';
Francesco Borzi 提问于2021-11-02
我也一样。Angular在一个随机的组件中炸开了锅,说无法读取未定义的属性。结果发现,导入的路径是错误的。khollenbeck 2022-06-13
#3楼
得票数 1

当我试图安装一个带有npm install [path to module here]的本地npm模块时,我得到了错误"Cannot read properties of undefined (reading 'spec')"

问题的根源是:我没有在本地模块的package.json文件中给它起一个名字。

Raffi 提问于2022-02-21
Peter Mortensen 修改于2022-08-15
#4楼
得票数 1

在我的例子中,错误是类似的,但我得到了一个不同的解决方案,因为我在JavaScript文件中使用了body-parser模块。

我不得不加入

app.use(bodyParser.urlencoded({ extended: true }));
KESHAV CARPENTER 提问于2022-06-30
Peter Mortensen 修改于2022-08-15