关于添加动态数据源绑定功能的支持想法 about tmagic-editor HOT 15 CLOSED

赞，作为维护方，我们近期正在规划该功能

from tmagic-editor.

示例地址：https://dv.wangminghua.com/
很棒的想法与实现

数据源功能已经在规划中，计划近期实现，欢迎贡献宝贵的想法与代码

from tmagic-editor.

数据源功能是属于比较大的功能，建议先将其拆分，然后一起一一讨论对齐实现，例如：DSL的设计，组件中的实现（不同框架的实现），编辑中的交互（如何关联数据源，如果绑定字段），数据源声明周期，数据源作用域，等等这些问题

from tmagic-editor.

数据源功能是属于比较大的功能，建议先将其拆分，然后一起一一讨论对齐实现，例如：DSL的设计，组件中的实现（不同框架的实现），编辑中的交互（如何关联数据源，如果绑定字段），数据源声明周期，数据源作用域，等等这些问题

恩，我也不确定贵方已经实现到了什么程度，我先将数据源的核心代码贴到这里，你看下是否和你们的设计理念冲突。

通过 d.ts 声明文件给node节点拓展了2个字段

DataSet 是个独立的ts类：http://oss.wangminghua.com:9090/test/data-source.ts

from tmagic-editor.

其他的都是基于该核心的上层运用

from tmagic-editor.

数据源加载的时机是什么？在页面渲染之前？

from tmagic-editor.

在这里我简单描述一下数据源的工作原理：

通过编辑器创建 DSL 这个流程不变，在页面渲染前，遍历DSL每一个节点，如果节点（MNode）需要绑定数据源（bind = true 且 节点数据绑定映射字段attrs有效），则通过Proxy包装MNode节点，做属性拦截并替换需要映射（attrs列表）的属性（reactive）。

然后有数据源更新时，重新赋值reactive对象。

from tmagic-editor.

每个数据集包含了多个数据源，数据集负责数据的读取（只读），数据源对象负责数据的写入（只写），读写分离

from tmagic-editor.

只要有数据源更新就重新执行一下setDataSet? 这样做不会有性能问题吗？

from tmagic-editor.

setDataSet 仅需要调用一次，主要目的是为了替换需要代理的MNode的属性从ds中读取，其中ds使用的是观察者模式，数据更新则是依赖于 vue 的 reactive 机制，我认为基本无性能损耗问题，而数据的更新频是由有数据源配置决定，由于我目前仅使用的vue，像react等，可以做个适配插件或者接口来替换vue专有的reactive机制

from tmagic-editor.

#485 这是我先提交的支持数据源绑定的核心，我在源码中添加了测试代码，请不要合并，先拉取下来测试一下。

from tmagic-editor.

另外能否在QQ群中联系到你们，我好频繁截图之类的描述的想法和测试用例。

from tmagic-editor.

可以的联系官方小助手就行了

from tmagic-editor.

添加了通用响应式模块，同时将数据源中的Data对象包装为响应式对象，由运行时决定。当前支持vue2、vue3、react响应式更新

from tmagic-editor.

已移除第三方响应式框架，添加了自定义响应式模块

from tmagic-editor.