1.将props直接拆解内层直接使用
import React from 'react';
interface Props {
from: string;
message: string;
}
const Demo: React.FC<Props> = ({ from, message }) => {
return (
<div>
<p>来自{from}的消息</p>
<p>{message}</p>
</div>
);
}
export default Demo;
2.不拆props
import React from 'react';
interface Props {
from: string;
message: string;
}
const Demo: React.FC<Props> = ( props ) => {
const { from, message } = props;
return (
<div>
<p>来自{from}的消息</p>
<p>{message}</p>
</div>
);
}
export default Demo;
使用组件Demo
import Demo from './ListTableList/components/Demo';
<Demo message="你的typescript水平咋样了？" from="liuyunshengs" />