const MenuButton = memo(
({
index,
onButtonClick,
}: {
index: number;
onButtonClick: (type: string, index: number) => void;
}) => (
<React.Fragment>
<Button
size="small"
style={{ marginRight: '10px' }}
onClick={() => onButtonClick('edit',index)}
type="link"
>
编辑
</Button>
<Button size="small" type="link"
onClick={() => onButtonClick('remove', index)}>
删除
</Button>
</React.Fragment>
),
);
子组件嵌套memo防止重复渲染
<MenuButton index={index} onButtonClick={onButtonClick} />
默认为上面传入得两个参数
({
index,
onButtonClick,
}: {
index: number;
onButtonClick: (type: string, index: number) => void;
})
ts指定返回值类型