我已经看到了两种在带有Typescript的React中声明SFC的方法,这两种是:
import * as React from 'react' interface Props { message: string } const Component = (props: Props) => { const { message } = props return ( <div>{message}</div> ) } export default Component
和:
import * as React from 'react' interface Props { message: string } const Component: React.StatelessComponent<Props> = props => { const { message } = props return ( <div>{message}</div> ) } export default Component
从这个问题中]我看到,如果您在组件中使用它,则可以通过第二种方法从界面中忽略子级。
还有其他区别吗?哪一个是首选, 为什么 ?
看起来React.SFC和React.StatelessComponent已弃用。
React.SFC
React.StatelessComponent
使用React.FunctionComponent来代替:
React.FunctionComponent
import * as React from 'react' interface IProps { text: string } export const MyComponent: React.FunctionComponent<IProps> = ({ text }: IProps): JSX.Element => <div>{text}</div>
从技术上讲,这个名字并不意味着同一件事,因为Dan Abramov很好地总结了这一点。
编辑:请注意,它经常像React.FC<>现在一样被别名。
React.FC<>