在React中通过TypeScript进行解构赋值

Question

我该怎么办

class App extends React.Component {
    render() {
      const { x, y, z} = this.props;
      return (...)
    }
}

TypeScript中的

？现在tslinter显示错误：

  

键入＆＃39; Readonly＆lt; {children？：ReactNode; }＆GT; ＆安培;只读＆LT; {}＆GT;＆＃39;没有   财产＆＃39; x＆＃39;并且没有字符串索引签名。

Answer 1

您必须为道具定义类型：

interface Props {
    x: string;
    y: number;
    z: string;
}

class App extends React.Component<Props, {}> {
    render() {
      const { x, y, z} = this.props;
      return (...)
    }
}