如何创建具有正确类型的反应组件映射[重复]

Question

我正在尝试使用 typescript 创建一个反应组件映射，它根据键返回相应的组件，Item1 和 Item2 都是反应组件。

const componentMap: {[key: string]: JSX. Element} = {
 "Item1": Item1,
 "Item2": Item2,
}

下面是item1和item2的定义

type itemProps = {
  props1: string,
  props2: boolean,
}

export const Item1 = (): JSX.Element => {
  return (<div/>)
}

export const Item2 = (props: itemProps): JSX.Element => {
  return (<div/>)
}

codesandbox sample

但得到警报

TS2739: Type 'OverridableComponent<BoxTypeMap<{}, "div">>' is 
missing the following properties from type
 'ReactElement<any, any>': type, props, key

Answer 1

你可能需要一个 ReactElement 或 ReactNode 作为类型。请参阅When to use JSX.Element vs ReactNode vs ReactElement? 了解何时使用哪个。