zarm-web/es/alert/AlertInstance.js

基于 React 的桌面端UI库

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

import React from 'react';
import ReactDOM from 'react-dom';
import Alert from './Alert';
const div = document.createElement('div');
let visible = false;

class AlertExtension extends Alert {
  static defalut(option) {
    document.body.appendChild(div);
    const defalutValue = {
      width: 270,
      message: 'hello world',
      closeText: '关闭',
      hideIcon: false,
      theme: 'info',
      closable: true,
      onClose: () => {}
    };
    let object;

    if (option) {
      object = Object.assign(defalutValue, option);
    } else {
      object = _objectSpread({}, defalutValue);
    }

    ReactDOM.render(React.createElement(Alert, {
      width: object.width,
      visible: visible,
      message: object.message,
      closeText: object.closeText,
      hideIcon: object.hideIcon,
      onClose: () => {
        object.onClose();
        AlertExtension.hide();
      },
      closable: object.closable,
      theme: object.theme,
      locale: {
        close: 'close'
      }
    }), div);
  }

  static show(object) {
    visible = true;
    this.defalut(object);
  }

  static hide() {
    visible = false;
    ReactDOM.unmountComponentAtNode(div);
    document.body.removeChild(div);
  }

}

export default AlertExtension;