我对这种反应很陌生。这里我使用的是reactStrap
的模式。
<Modal isOpen={props.isOpen} centered='true'>
<ModalHeader>
Change this Question?
<button type="button" class="close" aria-label="Close" onClick={props.closeModal} ><span aria-hidden="true">×</span></button>
</ModalHeader>
<ModalBody>
<div className="row">
<div className="col-md-12 text-center ">
<Button type="submit" className="btn btn-outline-primary" onClick={props.showChangeQuestionModal} >Change by creating your own Question</Button>
</div>
</div>
<div className="row">
<div className="col-md-12 text-center marginForOrOption">
<span>or</span>
</div>
</div>
<div className="row">
<div className="col-md-12 text-center">
<Button type="submit" color="btn btn-primary">Change and Replace from Question bank</Button>
</div>
</div>
</ModalBody>
<ModalFooter>
</ModalFooter>
</Modal>
</div>
现在,我添加了这个按钮来关闭模态。但在反作用带,它是由default.But来的,在我的例子中,它是不会出现的。
另一个问题是,在ModalHeader中,它是默认的h5,所以我如何改变它呢?
发布于 2018-11-30 02:15:48
第一个问题:如果您希望reactstrap显示自己的“关闭”按钮,则需要将toggle
方法提供给 ModalHeader 组件的支持,这样您的ModalHeader看起来应该如下所示:
<ModalHeader toggle={this.toggleModalMethod}>
Change this Question?
</ModalHeader>
第二个问题:您不会在模态标头中使用h5做太多事情,但是您肯定可以更改h5元素样式,使其看起来像您希望它看起来的那样:
<ModalHeader>
<span className="customStyleToOverrideDefault">Change this Question?</span>
</ModalHeader>
请不要忘记投票支持我的答案,如果它对你有帮助的话。
https://stackoverflow.com/questions/53552407
复制相似问题