Modal 对话框

按钮用于开始一个即时操作。

何时使用#

标记了一个(或封装一组)操作命令,响应用户点击行为,触发相应的业务逻辑。

API#

属性 说明 类型 默认值
message 内容 string
属性 说明 类型 默认值
message 内容 string
属性 说明 类型 默认值
message 内容 string
属性 说明 类型 默认值
message 内容 string
duration 持续时间 'SHORT' 2s, 'LONG' 3.5s; 可选 SHORT
userStyle 用户自定义样式 object

代码演示


/** @jsx createElement */
import {createElement, Component} from 'weex-rx';
import { View, Text} from 'nuke-components';
import { Button,Modal } from 'nuke';
import {mount} from 'nuke-mounter';

let style={
    btns:{
        marginRight:'20rem'
    }
}
let App = class NukeDemoIndex extends Component {
    constructor() {
        super();

    }

    alert() {
        Modal.alert('Hi');
    }
    confirm(){
        Modal.confirm('是否确认', (result) => {});
    }
    prompt(){
        Modal.prompt('请输入', (result) => {});
    }
    toast(){
        Modal.toast('hello');

    }
    render() {
        return (
            <View style={{display:'flex',flexDirection:'row'}} >
                <Button style={style.btns} onPress={this.alert.bind(this)} type="primary">alert</Button>
                <Button style={style.btns} onPress={this.confirm.bind(this)} type="primary">confirm</Button>
                <Button style={style.btns} onPress={this.prompt.bind(this)} type="primary">prompt</Button>
                <Button style={style.btns} onPress={this.toast.bind(this)} type="primary">toast</Button>
            </View>
        );
    }
}

mount(<App/>, mountNode);

普通按钮。

mobile phone header