美文网首页
antd-Modal对话框

antd-Modal对话框

作者: Tina任 | 来源:发表于2017-07-09 13:44 被阅读0次

    <Modal  title="BasicModal"  visible={this.state.visible}

    onOk={this.handleOk}   onCancel={this.handleCancel}> footer={false}

    </Modal>

    title:用来设置模态框的标题

    visible:用来控制显示隐藏,一般操作都是将它的状态设置为false,然后通过按钮点击改变状态变成true,然后点击取消或者关闭按钮,或者确定按钮,将状态设置为false,隐藏此模态框

    onOk:底部的确定触发的方法

    onCancel:底部的取消以及右上角的关闭按钮触发的方法

    footer:底部样式,包含确定以及取消按钮,可以设置为false,不要自带的按钮,可以自己新写按钮。

    如果要更改modal的宽度,不用改css直接在modal上面加一个width属性

    备注:很多情况下使用modal的时候,由于modal不会自动清空旧数据,会导致第二次数据还是第一次的,解决方案就是,只有当visiable为true的时候,才引入modal,({visiable ? <Modal/>:''})

    相关文章

      网友评论

          本文标题:antd-Modal对话框

          本文链接:https://www.haomeiwen.com/subject/covshxtx.html