import { Button, Card, Icon, List, Typography } from 'antd'; import React, { Component } from 'react'; import { Dispatch } from 'redux'; import { PageHeaderWrapper } from '@ant-design/pro-layout'; import { connect } from 'dva'; import { StateType } from './model'; import { CardListItemDataType } from './data.d'; import styles from './style.less'; const { Paragraph } = Typography; interface PAGE_NAME_UPPER_CAMEL_CASEProps { BLOCK_NAME_CAMEL_CASE: StateType; dispatch: Dispatch; loading: boolean; } interface PAGE_NAME_UPPER_CAMEL_CASEState { visible: boolean; done: boolean; current?: Partial; } @connect( ({ BLOCK_NAME_CAMEL_CASE, loading, }: { BLOCK_NAME_CAMEL_CASE: StateType; loading: { models: { [key: string]: boolean }; }; }) => ({ BLOCK_NAME_CAMEL_CASE, loading: loading.models.list, }), ) class PAGE_NAME_UPPER_CAMEL_CASE extends Component< PAGE_NAME_UPPER_CAMEL_CASEProps, PAGE_NAME_UPPER_CAMEL_CASEState > { componentDidMount() { const { dispatch } = this.props; dispatch({ type: 'BLOCK_NAME_CAMEL_CASE/fetch', payload: { count: 8, }, }); } render() { const { BLOCK_NAME_CAMEL_CASE: { list }, loading, } = this.props; const content = (

段落示意:蚂蚁金服务设计平台 ant.design,用最小的工作量,无缝接入蚂蚁金服生态, 提供跨越设计与开发的体验解决方案。

{' '} 快速开始 {' '} 产品简介 {' '} 产品文档
); const extraContent = (
这是一个标题
); const nullData: Partial = {}; return (
> rowKey="id" loading={loading} grid={{ gutter: 24, lg: 3, md: 2, sm: 1, xs: 1 }} dataSource={[nullData, ...list]} renderItem={item => { if (item && item.id) { return ( 操作一, 操作二]} > } title={{item.title}} description={ {item.description} } /> ); } return ( ); }} />
); } } export default PAGE_NAME_UPPER_CAMEL_CASE;