Question

我们使用react-modal来显示模态对话框，我们有以下代码

<Modal.Header closeButton>
     <Modal.Title>Drugs</Modal.Title>
</Modal.Header>

关闭按钮显示在附加图像中。之前有人遇到过同样的问题吗？Close Button issue

Answer 1

它不一定优雅，但这是一个解决方案。我使用React / Redux，所以在我的容器上，我将以下函数从我的调度映射到props：

const mapDispatchToProps = (dispatch) => {
    ...

    fixCloseLabel: function(e) {
      e.getElementsByClassName('modal-header')[0].getElementsByTagName('span')[0].innerHTML = 'x'
    }

    ...
}

然后在模态本身上我添加了以下内容：

<Modal show={this.props.twitterModalVisible} onEnter={this.props.fixCloseLabel} onHide={this.props.hideTwitterModal}>

只要确保你将你的道具沿着链条传递，你应该好好去！

Answer 2

您只需添加元标记即可将编码设置为UTF-8：

<meta charset="UTF-8">

https://github.com/react-bootstrap/react-bootstrap/issues/2098

React-bootstrap模式在＆＃39; x＆＃39;中显示无效字符标记

2 个答案: