vue-grid-layout组件如何做到拖拽生产新的组件

Question

现在vue-grid-layout是可以栅格拖拽，添加新组件也是固定到某位置。如何可以做到：比如左边有一列的组件，拖拽后可到栅格布局里进行排位，也不是先添加到某个地方后再排位

Answer 1

今天也碰到了和题主类似的需求，不知道题主最后是如何解决的，我这边说下我的实现方式。
1.通过控制台的eventlistener可以判断出组件是通过pointerup pointerdown pointermove事件来实现拖动的，分析出这点，接下来就好办了
2.在图中左侧元素的dragenter事件中触发pointerdown 自定义事件

dom.dispatchEvent(new PointerEvent('pointerdown', {
  clientX: event.clientX,
  clientY: event.clientY,
  pointerType: 'mouse',
  bubbles: true
})

3.dragover事件中触发pointermove 自定义事件，drop事件中触发pointerup 自定义事件，方式和上面一样
大功告成！

demo：
https://pan.baidu.com/s/1x3gr...
如有帮助就顺手点个赞吧，谢谢各位大佬~

Answer 2

求代码一份，十分感谢。446443540@qq.com

Answer 3

跪求，请大佬给一份demo，搞了蛮久还是有些问题，295891987@qq.com。

Answer 4

大佬求一份源码