能否讲一下思路

[yzy8366]

能大概讲一下整个东西大概的思路吗

[jaweii]

可以的

拖动组件到预览视图后，得到了组件名、UI名、UUID，传入到封装的getTemplate函数里，得到了一个包含模板、对象、slots等信息的对象； 所有拖动到预览视图的对象，都保存在vuex的components数组里，每个对象的父子级关系，通过对象的parentId和slots里面的id来关联； 预览视图中有一个v-for循环，仅将components数组中所有最父级的component渲染成空元素，元素的id就是component的id； 当有组件拖入或者监测到components数组变化后，就会执行mount方法，即把component.template传入到new Vue({})中，并根据id挂载到v-for渲染的dom中； 由于属性视图的属性变化，也会导致components变化，被监听到后，也会重新挂载，这就实现了属性可视化编辑的功能； 当拖动到其他组件上时，会被认为是嵌套行为，随即就会弹出一个菜单，选择要嵌套到组件哪个插槽（slot），选择后，就会将新组件id添加到component.slots的对应位置中，这样又会触发components变化，并更新模板为包含新嵌套组件的模板;

这就是大致思路，我也是摸索出来的

[Marinerer]

个人愚见： 我看来下源码，用vue内置组件 <component :is=""> 来 替代 循环 new Vue(P{})， 会不会更好点呢。