2020-03-31 13:47:59 +08:00

74 lines
1.8 KiB
JavaScript

import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import ConfigProvider from '../config-provider';
/**
* Card.Header
* @order 2
*/
class CardHeader extends Component {
static propTypes = {
prefix: PropTypes.string,
/**
* 卡片的标题
*/
title: PropTypes.node,
/**
* 卡片的副标题
*/
subTitle: PropTypes.node,
/**
* 标题区域的用户自定义内容
*/
extra: PropTypes.node,
/**
* 设置标签类型
*/
component: PropTypes.elementType,
className: PropTypes.string,
};
static defaultProps = {
prefix: 'next-',
component: 'div',
};
render() {
const {
prefix,
title,
subTitle,
extra,
className,
component: Component,
...others
} = this.props;
return (
<Component
{...others}
className={classNames(`${prefix}card-header`, className)}
>
{extra && (
<div className={`${prefix}card-header-extra`}>{extra}</div>
)}
<div className={`${prefix}card-header-titles`}>
{title && (
<div className={`${prefix}card-header-title`}>
{title}
</div>
)}
{subTitle && (
<div className={`${prefix}card-header-subtitle`}>
{subTitle}
</div>
)}
</div>
</Component>
);
}
}
export default ConfigProvider.config(CardHeader);