我使用了一个物料表作为可重用组件，在其他组件中调用如下。
class UserTable {
name: string;
vehicleId: number;
garageId: number;
}
tableColumns: Array<Column> = [
{
columnDef: 'name',
header: 'Name',
cell: (element: Record<string, unknown>) => `${element['name']}`
},
{
columnDef: 'vehicleId',
header: 'Vehicle',
cell: (element: Record<string, unknown>) => {
const vehicle = this.vehicleList.find(vehicles => vehicles.id === element['vehicleId']);
return vehicle?.name;
}
},
{
columnDef: 'garageId',
header: 'Garage',
cell: (element: Record<string, unknown>) => {
const garage = this.garageList.find(garages => garages.id === element['garageId']);
return garage?.name;
}
}
];用户类
class User implements IUser {
id: number;
name: string;
description: string;
vehicleId: number;
garageId: number;
}我需要在表中显示名称，车辆名称，车库。显示车辆名称，我用上面的代码。它的作品，但给予控制台错误'* 无法读取属性的未定义（阅读'查找'）*'，也不能看到车库名称。
我能做些什么呢？
1条答案
按热度按时间zxlwwiss1#
根据docs，arrow函数没有绑定到
this，因此不应该被用作对象的方法，而这正是你要做的。这意味着
this.vehicleList可能不是您所期望的--也就是说，它读取了函数调用者的vehicleList属性，而该属性可能没有定义。为了更好地理解，请看下面的示例：
您可能应该阅读更多关于
this、arrow functions和scope的内容，以便更好地理解它。您可能希望将arrow函数切换到function expression，看看它是否解决了作用域问题。