#yyds干货盘点 【React工作记录二十一】ant design封装一个弹框组件

//取消机构和取消讲师的方法封装
//params visible控制弹框的一个现实和隐藏
//params content文本内容
import React from 'react';
import {
    Modal,
   Icon,
   Button 
  } from 'antd';
class CancelModel extends React.Component {
    stata = {
    }
    //控制确定调用的函数
    handleOk=() => {
        this.props.handleOk&&this.props.handleOk();
    }
     //控制弹窗的一个关闭
     handleCancel=() => {
        this.props.handleCancel&&this.props.handleCancel();
    }
    //控制页面跳转的参数
    handleSkip=() => {
        // this.props.handleSkip&&this.props.handleSkip();
    } 
    render() {
        const {cancleVisible,content}=this.props
        return (<div>
        <Modal
          title="提示"
          visible={cancleVisible}
          onOk={this.handleOk}
          onCancel={this.handleCancel}
          style={{textAlign:'center'}}
        >
            <Icon type="exclamation-circle" />
            <p>{content||''}</p>
            {/* <Button type="link" block onClick={this.handleSkip}>
            点击跳转
            </Button> */}
        </Modal>
        </div>)
    }
}
export default CancelModel

import CancelModel from '../common/ComponentsList/cancleModel'

<CancelModel content={content}  handleOk={this.
handleLectureOk} cancleVisible={cancleVisible} 
handleCancel={this.handleLectureCancle} />