react antd 函数式弹窗案例

发布时间 2023-04-25 09:41:32作者: 最好的年纪

 

1.弹窗函数

export const checkReviewTaskTipModal = async (checkResult: {
  status: boolean;
  mseeage: string;
}) => {

  return new Promise((r, j) => {
    const cancelFc = () => {
      mConfirm?.destroy();
    };
    const mConfirm = Modal.confirm({
      className: 'checkReviewTaskTipModal',
      width: 420,
      icon: <ExclamationCircleFilled />,
      title: 'XXXXXX未完成,XXXXXX可能不准确,请选择操作:',
      mask: false,
      content: (
        <div className="checkReviewTaskTipModal-footer">
          <Button
            type="ghost"
            onClick={() => {
              r('toCancel');
              cancelFc();
            }}
          >
            取消
          </Button>
          <div className="checkReviewTaskTipModal-footer-action-right">
            <Button
              type="ghost"
              onClick={() => {
                r('toContinue');
                cancelFc();
              }}
            >
              仍然发起
            </Button>
            <Button
              type="primary"
              onClick={() => {
                r('toSetting');
                cancelFc();
              }}
            >
              前往设置
            </Button>
          </div>
        </div>
      ),
    });
  });
};