react-app-shell/activity/src/views/component/weixin-modal/index.js

react打包脚本和example, 这里的版本请忽略

import React from 'react';
import {BaseModal} from '../../../components/index';
import PropTypes from 'prop-types';

import style from './style.less';
import image_close from '../../../public/images/group/close.png';
import image_qr from '../../../public/images/group/qr.png';

/**
 * 微信二维码弹窗
 */
function WeiXinModal(props) {
    const handelCancel = () => {
        const {onCancel = null} = props;
        onCancel && onCancel();
    };
    const image = props.imageUrl || image_qr;
    const renderHead = () => {
        const {header} = props;
        return (
            <div className={style['header']}>
                {header}
            </div>
        );
    };
    return (
        <BaseModal
            visible={true}
            header={renderHead()}
        >
            <div className={style['content']}>
                <img src={image}/>
                <div className={style.close} onClick={handelCancel}>
                    <img src={image_close} alt={''}/>
                </div>
            </div>
        </BaseModal>
    );

}

WeiXinModal.defaultProps = {
    header: '关注魔力耳朵，随时咨询客服'
};

WeiXinModal.propTypes = {
    header: PropTypes.oneOfType([
        PropTypes.string,
        PropTypes.element
    ])
};

export default WeiXinModal;