index.jsx 1.1 KB

123456789101112131415161718192021222324252627282930313233343536
  1. import React, { Component } from "react";
  2. import ReactDom from "react-dom";
  3. import style from "./index.less";
  4. import Notify from '@commonComp/Notify';
  5. import close from '@common/images/icon_close.png';
  6. /**
  7. * title:标题
  8. * children:弹窗内容
  9. * onClose:弹窗关闭事件
  10. * shadeClose:点蒙层关闭,默认true
  11. *footer:固定在弹窗底部的内容如确定按钮
  12. *
  13. * **/
  14. class ComplexModal extends Component {
  15. constructor(props) {
  16. super(props)
  17. }
  18. render() {
  19. const { onclose,title,children,footer,shadeClose} = this.props;
  20. const domNode = document.getElementById('root');
  21. return ReactDom.createPortal(<div className={style['container']}>
  22. <div className={style['shade']} onClick={shadeClose===false?'':onclose}></div>
  23. <div className={style['modal']}>
  24. <div className={style['close']}>
  25. {title}
  26. <img src={close} onClick={onclose} />
  27. </div>
  28. <div className={style["content"]}>{children}</div>
  29. <div className={style['footer']}>{footer}</div>
  30. </div>
  31. </div>,domNode);
  32. }
  33. }
  34. export default ComplexModal;