用React.FC可以在组件中改变state的值,详情可见React Hook
import React, { useState } from 'react';
export interface UserProps {
updateModalVisible: boolean;
}
const User: React.FC<UserProps> = () => {
let [count, setCount] = useState(4);
const changeVal = () => {
count++;
setCount(count);
};
return <div style={{ padding: 20 }}>
<h1>User页面</h1>
<h2>{count}</h2>
<button onClick={changeVal}>改变我的值</button>
</div>;
};
export default User;
ReactElement is an object with a type and props.
ReactElement 是一个有type和props的对象.
被createElement函数调用,根据环境设置对应的属性
export interface AvatarListProps {
Item?: React.ReactElement<AvatarItemProps>;
size?: SizeType;
maxLength?: number;
excessItemsStyle?: React.CSSProperties;
style?: React.CSSProperties;
children: React.ReactElement<AvatarItemProps> | React.ReactElement<AvatarItemProps>[];
}
JSX.Element = ReactElement
JSX.Element-> React.createElement的返回值
class Class implements JSX.Element {
// @ts-ignore
key: React.Key | null | undefined;
props: any;
type: any;
}
ReactNode 可以是 ReactElement, ReactFragment, string ,a number 或者一个数组 ReactNodes, 或者null,或者 undefined, 或者 a boolean:
React.ReactNode->组件的返回值
render(): ReactNode;