在 TypeScript 中动态创建属性

Posted 2023-03-25

【中文标题】在 TypeScript 中动态创建属性

【英文标题】：Creating Properties Dynamically in TypeScript

【发布时间】：2022-01-16 09:03:51

【问题描述】：

我正在使用 DevExpress (devextreme) 的 DataGrid 构建一个数据输入应用程序，并允许用户添加和删除除键列之外的列。我将列配置和用户数据都存储在 SQL 中。用户数据存储为

Key | ColumnName        | ColumnValue
-------------------------------------
1     Company             Apple
1     NumberOfEmployees   12345

然后我旋转数据以发送到网格。

Key | Company | NumberOfEmployees
---------------------------------
1     Apple     12345

当用户更新网格中的一行时，网格会传回一个数据对象，其中包含每列的属性。我正在使用列定义来尝试查找和匹配这些属性，但没有得到预期的结果。

const userColumns: any[] = [
    
        ColumnName: 'Company'
    , 
        ColumnName: 'NumberOfEmployees'
    
];

const returnedFromGridRow: Record<string,any> = ;
returnedFromGridRow.Company = 'Apple';
returnedFromGridRow.NumberOfEmployees = 12345;

let result: Record<string,any> = ;
const results: any = [];

userColumns.forEach(function (value) 
  let x: string = value.ColumnName;
  let y: string = returnedFromGridRow[x];
  
  result = x:y;
  console.log(result);
  results.push(result);
);

期待

 "Company" : "Apple" 
 "NumberOfEmployees" : 12345 

但得到

 "x" : "Apple" 
 "x" : 12345 

Playground

【参考方案1】：

您用来创建result 对象的方式不起作用，因为它以x 作为键。要动态指定键，请更改创建动态对象的方式，如下所示以获得预期结果：

userColumns.forEach(function (value) 
  let x: string = value.ColumnName;
  let y: string = returnedFromGridRow[x];
  
  result[x]=y; // This is the change
  console.log(result);
  results.push(result);
);