[英]Typescript React component type mismatch
Getting a typescript error when defining any type of simple react functional component with any number of props, including using FC, ComponentWithChildren etc...使用任意数量的道具定义任何类型的简单反应功能组件时出现打字稿错误,包括使用 FC、ComponentWithChildren 等...
Here's a minimal reproduction这是一个最小的复制
type Props = {
className?: string;
};
const Horizontal: Props = ({ className = undefined }) => (
<div />
);
Gives me the error给我错误
Type '({ className }: { className?: undefined; }) => Element' has no properties in common with type 'Props'.ts(2559)
类型 '({ className }: { className?: undefined; }) => Element' 与类型 'Props'.ts(2559) 没有共同的属性
I don't understand this is how i always defined components.我不明白这就是我一直定义组件的方式。 Is there something new in typescript that i don't know about?
打字稿中有什么我不知道的新东西吗?
{
"name": "call-mvp",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^13.2.0",
"@testing-library/user-event": "^13.5.0",
"@types/classnames": "^2.3.1",
"@types/jest": "^27.5.1",
"@types/node": "^16.11.36",
"@types/react": "^18.0.9",
"@types/react-dom": "^18.0.4",
"@types/react-measure": "^2.0.8",
"@types/react-router-dom": "^5.3.3",
"@types/styled-components": "^5.1.25",
"classnames": "^2.3.1",
"react": "^18.1.0",
"react-dom": "^18.1.0",
"react-measure": "^2.5.2",
"react-router-dom": "^6.3.0",
"react-scripts": "5.0.1",
"styled-components": "^5.3.5",
"typescript": "^4.6.4",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
这应该工作:
const Horizontal = ({ className = undefined } : Props) => ....
您可以将其更改为:
const Horizontal: FC = ({ className = undefined } : Props)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.