Question

我有以下一段代码

// type def
interface Props: { children: React.ReactNode }

React.Children.map(this.props.children, child => {

  // uh-oh!
  if (React.isValidElement(child)  && child.props.children) {
    // do sth
  }
}

哪个会导致打字错误：

语义错误TS2339类型“ {}”上不存在属性“子级”

在执行child之前，React.isValidElement的

类型定义为React.ReactNode：

type React.ReactNode = 
  | string 
  | number 
  | boolean 
  | {} 
  | React.ReactElement<any> 
  | React.ReactNodeArray 
  | React.ReactPortal 
  | null 
  | undefined

但是在执行React.isValidElement类型脚本后，确定子对象为React.ReactElement<{}>-它期望元素具有空的props，这会导致错误，因为它假定没有prop {{1 }}中的元素。代码无法编译。

我想念什么吗？有办法解决吗？

我的children：

tsconfig

打字稿：3.2.0
@ types / react“：^ 16.3.13”
@ types / react-dom“：^ 16.0.5”

Answer 1

如果知道所需的元素类型，则可以将类型参数传递给React.isValidElement。

替换此：

React.isValidElement(child)

与此：

React.isValidElement<Props>(child)

React.isValidElement（obj）确定obj为React.ReactElement <{}>类型

1 个答案: