首页 文章

在React组件的render函数中返回DOM元素

提问于
浏览
9

我有一个外部库,呈现一些自定义的js控件 . 该库返回一个可插入页面的DOM元素 .

我在React中为这个库创建包装器 . 除非我不确定如何允许render函数接受DOM元素作为返回,否则我已将它全部连接起来

render() {
 if (this.state.someType) {
   let customControl = new this.state.someType();
   var node = customControl.getNode(); 

   return node; //This is an HTMLDOMElement i.e. div or span
 }

 return <div>Loading Custom Control...</div>;
}

我能够调试代码,一切正常 . 节点是我所期望的,但页面上的html永远不会被替换 .

2 回答

  • 6

    这是一个简单的例子 .

    render() {
       const newNode = document.createElement('p'); 
       return <div ref={(nodeElement) => {nodeElement.appendChild(newNode)}}/>
    }
    
  • 6

    渲染一个普通的JSX div . 在里面使用 ref .

    ref 回调中使用 .appendChild(node)

    https://facebook.github.io/react/docs/refs-and-the-dom.html

相关问题