import * as React from "react"; import {withRouter,RouteComponentProps} from 'react-router-dom' import { Typography, Image } from "antd"; interface PropsType extends RouteComponentProps { id: string | number; size: "large" | "small"; imageSrc: string; price: number | string; title: string; } const ProductImageComponent: React.FC<PropsType> = ({ id, size, imageSrc, price, title, history, location, match }) => { return ( <div onClick={()=>history.push(`detail/${id}`)}> {size === "large" ? ( <Image src={imageSrc} height={280} width={480} /> ) : ( <Image src={imageSrc} height={120} width={240} /> )} <div> <Typography.Text type="secondary">{title.slice(0, 25)}</Typography.Text> <Typography.Text type="danger" strong> ¥{price}起 </Typography.Text> </div> </div> ); }; export const ProductImage = withRouter(ProductImageComponent)