Question

我有JSX类的打字稿代码

export class SearchForm extends React.PureComponent<Props, State> {

  public inputRef: React.RefObject<{}>;

  constructor(props: any) {
    super(props)
    this.inputRef = React.createRef()
  }

  public componentDidMount(): void {
      this.inputRef.current.focus()
      this.inputRef.current.select()
  ...

现在，当我尝试编译这段代码时，我遇到了很多错误：

ERROR in ...
TS2339: Property 'className' does not exist on type '{}'.

ERROR in ...
TS2339: Property 'focus' does not exist on type '{}'.

有什么问题吗？

Answer 1

错误在于inputRef: React.RefObject<{}>;的类型定义中，这是自动修复类型问题的默认建议。类型RefObject<{}>无法分配给类型RefObject<HTMLInputElement>。类型{}缺少类型HTMLInputElement的以下属性：接受，对齐，替代，自动完成等。

public inputRef: React.RefObject<{}>;的正确行应为：

  public inputRef: React.RefObject<HTMLInputElement>;

代码片段如下所示：

export class SearchForm extends React.PureComponent<Props, State> {

  public inputRef: React.RefObject<HTMLInputElement>;

  constructor(props: any) {
    super(props)
    this.inputRef = React.createRef()
  }

  public componentDidMount(): void {
      this.inputRef.current.focus()
      this.inputRef.current.select()
  ...

TS2339：类型“ {}”上不存在属性“焦点”。使用React打字稿

1 个答案: