在网页

Question

我有一个网页，其中大部分html都写在这个html里面<script type="text/template"></script>里面我有一个div，其中我的反应脚本应该呈现一个组件。 type="text/template"内的HTML正在使用我无法控制的javascript代码进行呈现。

当我在head底部body的{​​{1}}内添加对我的反应脚本的引用时，我总是得到

  

未捕获错误：_registerComponent（...）：目标容器不是DOM   元件。

如何在渲染所有HTML后加载react脚本，以便找到呈现其组件的节点

更新

这个脚本正在使用一些我无法控制的JavaScript代码进行渲染

<script type="text/template">
  <div>
   <ul class="new-component-template" id="xblocklist" >
    <!-- the react script is supposed to render here -->
   </ul>
  </div>
</script>

这个反应脚本在上面的脚本之前被加载，所以我得到了一个

  

目标容器不是DOM元素。   错误

var ListXblocks = React.createClass({

  componentWillMount: function(){
     this.setState({Problemstyle: this.props.Problemstyle})
     fetch('http://192.168.33.10:8002/XBlocks/')
     .then(result=>result.json())
     .then(result=> {
       this.setState({items:result})
     })
   },

  render:function(){
    return(

      <div>
        {
          this.state.items.map((item)=>{return(
            <li className="editor-manual" key={item.title}>
              <button type="button" className="button-component" data-category="problem" data-boilerplate="">
                <span className="name">{item.description}</span>
              </button>

            </li>)})

          }
      </div>

    );

  }

});

ReactDOM.render(<ListXblocks/>, document.getElementById('xblocklist'));