打字稿中声明部分的类型错误（Angular / React）答案

【问题标题】：Type error in declaration part in typescript (Angular/React)打字稿中声明部分的类型错误（Angular / React）
【发布时间】：2020-06-25 07:30:39
【问题描述】：

当我尝试运行以下组件时，它在我的声明中显示类型问题

以下是我得到的问题输入'{首先：字符串[];第二：字符串[]；第三：字符串[]；四：字符串[]； }' 缺少类型 'any[]' 的以下属性：length、pop、push、concat 等 28 个。 TS2740

接口头声明我已经尝试过标头数据 any,String,Array 但它不起作用

   interface headers { 
    First: any[], 
    Second: any[],  
    Third: any[], 
    Four:any[],   
}

const headers 数据声明

const headers = {
      First: [
        'lara',
         'dravid',
         'sachin',
        'Ganguly',
      ],
      Second: [
       'kohli',
         'dhoni',
         'smith',
        'kane',
      ],
      Third: [
        'lee',
         'mustaq',
         'vaas',
        'shane',
      ],
      Four: [
       'bumrah',
         'starc',
         'jadeja',
        'shami',
      ],
    };  


Export state 
export interface State {  
    headersList: Array<any>  
}

主要组件类

export  class MyComp extends React.PureComponent<Props, State> {
  constructor(props) {
    super(props);
    this.state = { 
        headersList: headers, 
    };

【问题讨论】：

您正在将一个对象分配给一个数组。
@ritaj：你能给我举个例子吗？
headers 是一个对象，而 headersList 是一个数组。您不能将对象分配给数组。
可以尝试将headerList保持为JSONArray，即json对象数组。

标签： javascript angular reactjs typescript

【解决方案1】：

this.state = { 
    headersList: [headers], 
};

解决问题

【讨论】：

@JohnKen 很好。您可能应该更改其中一种类型，以便它们更好地组合在一起。这意味着要么将 headersList 设置为一个 headers 对象（这可能是最好的方法），要么将 headers 分离到一个实际的数组中。如果你愿意，我可以告诉你如何做这些:)