reactjs - 在 ReactJs 中拖放创建表单字段

Question

如何通过从侧边栏菜单中拖动字段选项按钮来创建类似于输入框的表单字段，就像 reactjs 中的 jotform 拖放功能一样。

我想在拖放功能上创建表单字段而不是附加拖动的元素

drop(e){
        let card_id = e.dataTransfer.getData('card_id')
        let card = document.getElementById(card_id)
        
        e.target.appendChild(card)
    }
    
    drag(e){
        e.preventDefault();
    }
    render() {
        return (
            <div className = {this.props.className}
            id = {this.props.id}
            onDragOver={(e)=>{this.drag(e)}}
            onDrop={(e)=>{this.drop(e)}}
            >
            {this.props.children} 
            </div>
        );
    }