Question

我是TypeScript的初学者，现在我想了解接口如何在React Component的Class Method中工作。我为此创建了一个简单的案例，但是它不起作用。像这样的帖子标题我总是会出错。

我会很高兴获得帮助。

import React, { Component } from 'react'

interface A {
  a: any[]
}

class Test extends Component {
  _getName = (a: A) => {
    return a
  }
  render() {
    const a = []
    return (
      <div>{this._getName(a)}</div>
    )
  }
}

export default Test

Answer 1

this._getName(a)期望a的类型为A。 A被定义为具有a类型的属性any[]的对象。您在a内的通话时间render的类型为[]。

我不确定您要用这段代码来完成什么，但是我想您想说的是a中的参数_getName应该是{{1}类型}？那么您可能需要any[]。

Answer 2

interface A {
  a: any[]
}

意味着实现接口“ A”的对象必须具有一个名为“ a”的属性，该属性的类型将为“ any []”（任何类型的数组）

但是在这里：

const a = []

看起来a只是一个空数组-不是对象，因此没有属性

我认为您在这里不需要界面。请尝试：

  _getName = (a: any[]) => {
    return a
  }

Answer 3

有必要这样做：

class Test extends Component {
  _getName = (a: A) => {
    return a.a;
  }
  render() {
    const a = {a: []};
    return this._getName(a);
  }
}

类型“ any []”的参数不能分配给类型“ A”的参数。类型“ any []”中缺少属性“ a”

3 个答案: