模态消息 Message

1.说明

展示操作反馈信息。

何时使用

• 可提供成功、警告和错误等反馈信息。

• 顶部居中显示并自动消失，是一种不打断用户操作的轻量级提示方式。

2.API

3.代码演示

/**
 * Created by ALOG on 17/6/5.
 */
let React =require( "react");
let ReactDOM=require("react-dom");
let wasabi=require("wasabiD");
let DataGrid=wasabi.DataGrid;
let Button=wasabi.Button;
let Message=wasabi.Message;
let Transfer=wasabi.Transfer;
var alogUtil = require("../libs/alogUtil.js");

class Demo extends React.Component {
    constructor(props) {
        super(props);

        this.alertHandler = this.alertHandler.bind(this);
        this.successHandler=this.successHandler.bind(this);
        this.errorHandler=this.errorHandler.bind(this);
        this.infoHandler=this.infoHandler.bind(this);
    }
    alertHandler(){
        Message.alert("弹出普通确认提示消息");
    }
    successHandler(){
        Message.success("弹出成功提示消息");
    }
    errorHandler(){
        Message.error("弹出错误提示消息");
    }
    confirmHandler(){
        Message.confirm("确认执行吗?",()=>{
            console.log("确定")
        },()=>{
            console.log("取消")
        })
    }
    infoHandler(){
        Message.info("弹出普通提示消息");
    }
    render(){
        return (
            <div>
                <Button name="alert" title="alert" onClick={this.alertHandler}/>
                <Button name="success" title="success" onClick={this.successHandler}/>
                <Button name="error" title="error" onClick={this.errorHandler}/>
                <Button name="confirm" title="confirm" onClick={this.confirmHandler}/>
                <Button name="info" title="info" onClick={this.infoHandler}/>
            </div>
        )
    }
}
ReactDOM.render(<Demo/>,document.getElementById("root"));