typescript - JSX 表达式中的空属性不再可分配给 "props"类型的 void

Question

我的 React 组件有以下声明，该组件曾经在 TypeScript 2.2 中编译，但现在在 TypeScript 2.3 中出现错误

class MyComponent extends React.Component<void, {}> {
  render() {
    return <div> Hello </div>
  }
}

// TS 2.3 : error TS2322: Type '{}' is not assignable to type 
// 'IntrinsicAttributes & IntrinsicClassAttributes<MyComponent> & Readonly<{ children?: ReactNode; }>...'.
//     Type '{}' is not assignable to type 'void'.
let m = <MyComponent />

Answer 1

类型参数应为 {}，而不是使用 void。

class MyComponent extends React.Component<{}, {}> {
  render() {
    return <div> Hello </div>
  }
}

在 TypeScript 2.3 中，空属性被视为空对象文字，这正是 React 对空 props 的行为方式。 TypeScript 2.3 现在也采用这种方式，因此当没有属性时，它会给出一个空对象文字类型。