react组件之importResult

一。组件

import React, {Component} from 'react'
import { Modal, Row, Col} from 'antd'

export default class ImportResult extends Component {
    constructor(props, context) {
        super(props);
        this.cancelPopup = this.cancelPopup.bind(this)
    }

    cancelPopup() {
        this.setState({
            importFlag: false,
            importCompleteFlag: false,
        });
        this.props.hide();
        // this.props.reset();
    }

    render() {
        const {title,data} = this.props;
        const style = {
            m_modal: {top: 0, paddingBottom: 0, margin: 0},
            marginBottom10: {marginBottom: '10px'},
            textAlign: {textAlign: 'center'}
        };
        return (
            <Modal style={style.m_modal} title={title} visible={true} centered
                   onCancel={this.cancelPopup} onOk={this.cancelPopup}>
                <Row gutter={24} style={style.textAlign}>
                    <Col style={style.marginBottom10} md={12}>导入数量</Col><Col style={style.marginBottom10}
                                                                             md={12}>{data.totalSum}</Col>
                    <Col style={style.marginBottom10} md={12}>有效数量</Col><Col style={style.marginBottom10}
                                                                             md={12}>{data.successSum}</Col>
                </Row>
            </Modal>
        )
    }
}

二。 引用

import ImportResult from './importResult'

   {/*导入完成*/}
                {importCompleteFlag ? <ImportResult title='导入完成' data={responseObj} hide={this.cancelPopup}/> : ''}

猜你喜欢

转载自blog.csdn.net/web_cgh/article/details/84030910