- form表單中使用問(wèn)號(hào)提示：
{
type: 'custom',
vmodel: 'skuSource',
skipLog: true,
label: 'SKU來(lái)源',
formItemLabelTips: <><div>sku隨便寫點(diǎn)字</div><div>指定SK</div></>,
formItemLabelTipsProps: {
children: <QuestionCircleOutlined className="m-x-5" />,
},
}
- table表頭標(biāo)題使用提示
{
align: 'center',
dataIndex: 'minStoreProductNumber',
title: (
<>
<Tooltip
title={
<div>
<div>隨便寫兩行</div>
<div>aaaa</div>
</div>
}
>
<span className="m-r-5">最低在線數(shù)</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;
}
