- form表单中使用问号提示：
{
type: 'custom',
vmodel: 'skuSource',
skipLog: true,
label: 'SKU来源',
formItemLabelTips: <><div>sku随便写点字</div><div>指定SK</div></>,
formItemLabelTipsProps: {
children: <QuestionCircleOutlined className="m-x-5" />,
},
}
- table表头标题使用提示
{
align: 'center',
dataIndex: 'minStoreProductNumber',
title: (
<>
<Tooltip
title={
<div>
<div>随便写两行</div>
<div>aaaa</div>
</div>
}
>
<span className="m-r-5">最低在线数</span>
<QuestionCircleOutlined />
</Tooltip>
</>
)
}
- modal中确定按钮在loading，禁止取消按钮
cancelButtonProps={{disabled: state.loading}}
- 大文本省略，悬浮显示
<OperationContent rows={2}>{item.dynamicInventoryRemark}</OperationContent>
import {Typography} from 'antd';
import React, {FC} from 'react';
import styles from './index.less';
/** 大文本省略，悬浮提示 */
const OperationContent: FC<IOperationContentProps> = ({
children,
rows = 11,
}) => {
return (
<Typography.Paragraph
className={styles['operation-content']}
ellipsis={{
rows,
tooltip: {
arrow: false,
children,
overlayClassName: styles['operation-content-tips'],
overlayInnerStyle: {whiteSpace: 'pre-wrap'},
placement: 'right',
},
}}
>
{children}
</Typography.Paragraph>
);
};
export {OperationContent};
interface IOperationContentProps {
children: React.ReactNode;
rows?: number;
}
