组件库文档

Modal对话框

模态对话框。

How to use?

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { modal } from 'ceshi-stone';
class App extends Component {
  openModal = () => {
    const myModal = modal.open({
      "size": 'sm',
      "template": this.getContentComponent(),
      "onCancel": this.closeModal,
      "onOk": this.okModal
    });
    // 该组件提供代码关闭弹框的手段，调用close方法即可！
    setTimeout(() => {
      myModal.close()
    }, 2000);
  }
  getContentComponent = () => {
    return (
      <div>
        <div className="modal-header">
            <span>提示</span>
        </div>
        <div className="modal-body">
            <p>如果没有保存，数据将会丢失，确认取消吗？</p>
        </div>
    </div>
    )
  }
  render(){
    return (
      <div>
        <Button onClick={this.openModal}>Open Modal</Button>
      </div>
    )
  }
}
ReactDOM.render(<App />, document.getElementById('root'));

组件方法

Options

Events