use antd Custom Confirm Modal

.confirm-modal-footer{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  button {
    font-weight: bolder;
    font-size: 23px;
  }
}

import React from 'react'
import { Modal, Button} from 'antd'

export default class ConfirmModal extends React.PureComponent {

  render() {
    const {visible, title, content, onCancel, onOk} = this.props
    return (
      <Modal
        visible={visible}
        title={title}
        mask={false}
        closable={false}
        centered
        maskClosable
        destroyOnClose={true}
        footer={<div className="confirm-modal-footer">
          <Button key="back" size="large" type="danger" onClick={onCancel}>
            没有
          </Button>
          <Button key="submit" size="large" type="primary" onClick={onOk}>
            有
          </Button>
        </div>}
      >
        {content}
      </Modal>
    )
  }
}

使用：

<ConfirmModal
            visible={currentItem.category === "Handbag"}
            title={null}
            content=""
            onOk={() => {}}
            onCancel={() => {}}
          />

效果：

zhulinpinyu / zhulinpinyu.github.io

use antd Custom Confirm Modal #15