如何在 html 对象上附加 React 组件？

【问题标题】：How to append React Component at html object?如何在 html 对象上附加 React 组件？
【发布时间】：2018-06-06 15:01:29
【问题描述】：

我正在尝试实现拖放操作。用，onDragOver 找到 html 对象并设置这个对象（ex）div）

当我ondrop 时，我想在状态之后附加一些 React Component (ex) class Button extends Component)。

我找到insertAdjecentHtml 或replacewith。但是当我使用它时，它会打印为 [object Object] 那么这个东西有什么方法吗？

【问题讨论】：

标签： javascript reactjs

【解决方案1】：

在这种情况下，如果基于组件状态满足条件，您可以让渲染函数返回稍微不同的 html。

例如：

constructor() {
  this.state = {
    wasDragged: false;
  }
}
onDragStatusChange(){
  //what triggers this is up to you to determine.
  this.setState({
    wasDragged: true
  })
  // also consider setting it back to false under some condition
}
render() {
   <div>
   <p> heres the rest of our form!</p>
     {if(this.state.wasDragged) {
        <input type='button' value='click me' />
     }}
   </div>
   }
}

【讨论】：