前言

我是歌谣 我有个兄弟 巅峰的时候排名c站总榜19 叫前端小歌谣 曾经我花了三年的时间创作了他 现在我要用五年的时间超越他 今天又是接近兄弟的一天人生难免坎坷 大不了从头再来 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷

导语

封装一个card的组件

【React工作记录七十四】ant design tabCard封装_封装

【React工作记录七十四】ant design tabCard封装_封装_02编辑

核心代码

// 列表table的参数
export const tableListConfig = {
  MARGIN_TOP: 16,
  PADDING: 16,
};

【React工作记录七十四】ant design tabCard封装_封装_03

import React, { Component } from 'react';
import { Card } from 'antd';
import { tableListConfig } from '../../config/index';

/**
 * 统一 列表 Card 样式
 */

export const TableCard = (props = {}) => {
  const { rootStyle = {}, ...restProps } = props;
  return (
    <Card
      style={{ marginTop: tableListConfig.MARGIN_TOP, ...rootStyle }}
      bodyStyle={{ padding: tableListConfig.PADDING }}
      {...restProps}
    >
      {props.children}
    </Card>
  );
};

【React工作记录七十四】ant design tabCard封装_封装_04

总结

以上代码 这样就能使用了