mrcio-ui/lib/dialog/help-dialog.txt

1.安装
npm install mrcio-ui --save

2.引用
import {Dialog} from 'mrcio-ui'

3.dialog API 属性
属性名（name）	类型（type）	必要性（Required）	默认值（default）	描述（description）
open            Boolean      true               false               是否显示弹出框
handleClose     Function     false                                  点击旁边触发的办法，可关闭弹出框
title           String       false                                  弹出框的标题
actions         ArrayDom     false                                  底部按钮传参
contentStyle    Object       false
titleStyle      Object       false
bodyStyle       Object       false
actionStyle     Object       false


4. 使用方式
import React, {Component, PropTypes} from 'react';
import {bindActionCreators} from 'redux'
import {Button, Dialog} from 'mrcio-ui'

class TestDialog extends Component {
    constructor(props) {
        super(props);
        this.state = {
            open: false,
        }
    };

    showDialog = () => {
        this.setState({
            open: true,
        })
    };
    handleClose = () => {
        this.setState({
            open: false,
        })
    };

    render() {
        //可传一个或者两个
        const actions = [
            <Button scenesType="submit" btnText="确认" handleBtn={this.handleClose}/>,
            <Button scenesType="back" btnText="返回" handleBtn={this.handleClose}/>
        ];
        return (
            <div>
                <div onClick={this.showDialog}>弹框</div>
                <Dialog
                    open={this.state.open}
                    //handleClose={this.handleClose}
                    title="休假申请"
                    actions={actions}
                    //contentStyle={{
                    //    background: "green",
                    //}}
                    //titleStyle={{
                    //    background: "red",
                    //}}
                    //bodyStyle={{
                    //    background: "blue",
                    // }}
                    //actionStyle={{
                    //    background: "yellow",
                    //    justifyContent: "center",
                    //}}
                >
                    <div>
                        这里是弹出的主要内容
                    </div>
                </Dialog>
            </div>
        )
    };
}

export default TestDialog;



5.help
@Author fuyan Gu
@Email 1303928929@qq.com