Javascript 反应不变违反

我有一个引导模式，默认情况下不显示。因此，我添加了一个jQuery脚本，它应该显示模式

我的代码如下：

<div>
   <div id='tableContainer'>
       <table className="table table-condensed"></table>
   </div>

   {this.state.displayDeleteModal
                    ?
                    <div>
                        <div id="myModal" className="modal fade modalMaxSize" role="dialog">
                            <div className="modal-dialog">

                            <div className="modal-content">
                              <div className="modal-header">
                                <button type="button" className="close" data-dismiss="modal">&times;</button>
                              </div>
                              <div className="modal-body">
                                <p>Are you sure you want to delete selected elements?</p>
                              </div>
                            </div>

                          </div>
                        </div>
                        <script>
                            {$(function(){
                                $('#myModal').modal('show');
                            })}
                        </script>
                    </div>
                    :
                    null
                }

</div>

但是，在添加jQuery脚本后，我开始出现以下错误：

未捕获错误：不变冲突：traverseAllChildren（…）：遇到无效的子级；DOM元素不是React组件的有效子级

这是什么原因造成的

---

另外，我使用jQuery的方式正确吗？

可能是您的

按钮使用不正确，它可能被打开，使用
值
属性错误是一个React错误（不是jQuery）。你也可以分享React（javascript）代码吗？我从这里获取了模式代码。模式代码来自哪里并不重要，错误来自React库，而不是jquery或bootstrap
getInitialState: function() {
    return {displayDeleteModal: false};
},