打字稿 - 如何修复非 Typescript React 组件的子属性上的"属性子项不存在"错误?



我有一个在tsx扩展中编写的父组件和一个在'jsx'扩展中编写的子组件:

Child.jsx(不是实际的组件,只是一个示例)

const Child = props => {
const { children } = props
return (<a>{children}</a>)
}

Parent.tsx

const Parent = (props: IProps) => {
return (
<Child>This is my data</Child>
)
}

然而,我在Parent.tsx上得到一个Typescript错误:

属性'children'在类型'IntrinsicAttributes '上不存在

现在,在一个完美的世界里,我可能会重构Child.jsx为一个Typescript文件,并将childrenprop类型为React.ReactNode,但如果这是一个遗留的子文件,非常复杂,它本身有需要重构的子文件,等等?

是否有办法克服父类发出的Typescript错误?

React 18停止包含隐式的子道具。您需要显式地添加它。

https://solverfox.dev/writing/no-implicit-children/

我们需要开始向各种依赖项目提交pr(到目前为止我已经做了两次)以添加显式的children prop。也许降级React版本,直到情况平静下来?