【技术实现步骤摘要】
本专利技术属于数据调试方法，尤其涉及一种基于mock的数据调试方法，本方法适用于前端领域的低代码开发场景。
技术介绍
1、在前端领域的低代码开发场景中，页面开发的最基本单元是组件，并且随着业务复杂度的不断上升，通常还需要基于基础组件拼凑出系列的业务组件。
2、业务组件通常是业务数据的展示，或与业务逻辑相关的界面操作。即使在可视化开发的场景下，也面临着和传统开发相似的情况，业务组件的数据依旧需要等到后端提供对应的接口或数据后才能进行对接，而且使用可视化开发的组件和传统编码开发的组件相比，通常会面临调试困难的问题，需要在该业务组件运行过程中对实际运行效果进行不断调试，以判断该业务组件是否能够正常工作。由于当前使用的低代码开发组件的模式在数据调试上存在短板，在组件调试上也存在缺陷，从而极大地降低了开发的效率。
技术实现思路
1、为了克服现有低代码开发组件的模式在数据调试和组件调试上存在的上述缺陷，提高开发的效率，本专利技术提出了一种新的基于mock的数据调试方法。
2、术语解释
3、mock：在软件开发中，mock(模拟)通常是指创建一个模拟对象或者虚拟版本的组件，用于代替真实的组件或服务。这个模拟对象被设计成模仿实际组件的行为，以便在软件开发和测试过程中进行模拟和替代。
4、数据调试：数据调试是指在软件开发或数据分析过程中，通过检查和分析数据，以解决问题、改进程序或确保数据质量。
5、低代码开发：低代码开发平台(lcdp)本身
6、在本专利技术中，我们提出了一种基于mock的数据调优方案，本方案能够在编辑器中为已经开发好的组件直接定义mock数据，并在编辑器中进行实时渲染，渲染过程和组件实际运行的逻辑一致，因而能够在编辑器中直观地观察组件的数据处理逻辑是否存在问题，极大地提高了在可视化场景中组件的开发效率，而且本数据调优方案不侵入组件逻辑代码，不影响组件的复用性。
7、业务组件数据的展示通常需要符合大众的习惯，比如金额数值的前缀后缀、千分符等，为了能够快速配置和对数据进行格式化，本专利技术方法中还提供了数据加工功能，使用者只需要选择数据并选择格式化的类别，即可实现对数据的加减乘除等基本的数学处理，并实现前缀后缀等功能。利用本方法用户只需简单配置，就可以改变数值的展示方式，如果通过传统的可视化组件开发，则需要重新开发编辑组件，甚至需要重新编写逻辑才能实现此效果。
8、此外，为了满足一些特殊场景的应用需求，本方法还提供了数据过滤的高级功能，能够在业务数据传递到组件之前，由用户编写代码进行过滤，再传递给组件。
9、如图5所示，本专利技术提供了一种基于mock的数据调试方法，本方法是针对低代码开发平台前端视图编辑器组件的数据调试方法，本方法包括：
10、s1.在初始化视图编辑器时，把当前页面的描述信息和结构的dsl传入视图编辑器的内部状态模块进行初始化，并对各组件的字段进行整合；
11、s2.按照初始化拷贝、选择性更新的方式，内部状态模块对页面的数据变量进行拷贝和隔离；
12、s3.组件数据模型层从内部状态模块获取当前页面的信息，对所得信息进行整合，计算得出当前组件的组件模型并提取组件渲染器需要的信息，根据该组件模型调用相应的组件渲染器来渲染组件；
13、s4.组件渲染器通过组件模型对相应的组件进行渲染。
14、进一步地，本专利技术基于mock的数据调试方法步骤s1中所述的内部状态模块用于管理应用的状态和当前的编辑信息，所述内部状态模块具备数据驱动能力，当视图编辑器的内部状态发生变化时，内部状态模块驱动渲染器重新渲染并更新视图；
15、所述内部状态模块包含供外部修改内部状态的接口。
16、进一步地，本专利技术基于mock的数据调试方法中所述的内部状态模块的数据驱动能力是指追踪数据的变化进而驱动视图更新的能力，该能力通过前端框架vue、react、或者观察-订阅者模式的程序来实现。
17、进一步地，本专利技术基于mock的数据调试方法步骤s1中所述的各组件的字段包括：页面的结构、页面的事件、页面的生命周期、组件的入参、组件的样式、组件的样式名称、渲染组件、组件的子节点。
18、进一步地，本专利技术基于mock的数据调试方法步骤s2中包括：
19、s21.在内部状态模块进行初始化时，对页面的数据变量进行一次拷贝，存储在内部状态模块的独立字段中，同时根据这个独立字段生成一个追踪此独立字段数据修改的响应值，该响应值随着独立字段的变化而变化，组件数据模型层读取该响应值，然后驱动该字段对应的组件进行视图更新；
20、s22.在独立字段中为组件设置mock数据，通过mock数据检查组件的运行效果；
21、s23.用户修改页面的数据变量时，补充或更新独立字段的内容。
22、进一步地，本专利技术基于mock的数据调试方法步骤s23中所述的补充或更新独立字段的内容，包括：更新之前检测当前独立字段的值和页面的数据变量是否是拷贝关系，如果是拷贝关系则直接更新对应的值，如果是设置新的值则放弃此次更新。
23、进一步地，本专利技术基于mock的数据调试方法步骤s3中所述的组件渲染器需要的信息包括：组件模型指定的渲染组件名称、组件的入参、组件样式、事件属性的处理。
24、进一步地，本专利技术基于mock的数据调试方法中所述的组件的入参绑定页面的数据变量，在组件模型的描述中，体现为组件的某个入参声明了对某个变量的名称引用，组件数据模型层识别出该变量的引用关系并将该字段替换成变量值传递给组件，并在数据变量更新时触发组件的渲染，将新的修改值传入组件内部。
25、进一步地，本专利技术基于mock的数据调试方法中所述的组件入参的处理步骤包括：在处理组件的入参时，根据当前组件模型声明的入参列表进行遍历，检查每个入参值是否绑定了数据变量，如果组件的入参绑定了数据变量，则直接对独立字段中的相应数据变量进行读取，此步骤执行完成后，组件的入参列表已经被转换成不带有变量名只有变量值的列表，将此入参列表传递给组件，即可完成从数据变量定义到组件渲染的过程。
26、另外，本专利技术还提供了一种计算机可读存储介质，所述存储介质上存储有计算机程序，所述程序被处理器执行时实现上述的基于mock的数据调试方法的步骤。
27、综上，本专利技术基于mock的数据调试方法对低代码可视化领域组件或页面的开发调试方式进行了改进，本方法通过引入数据隔离的机制，在编辑器中为组件设置mock数据检查组件的运行效果，mock调优过程只在编辑器生效，而不影响页面在渲染器实际运行的效果，从而在不侵入本文档来自技高网...
【技术保护点】
1.一种基于Mock的数据调试方法，其特征在于，所述基于Mock的数据调试方法是针对低代码开发平台前端视图编辑器组件的数据调试方法，本方法包括：
2.根据权利要求1所述的基于Mock的数据调试方法，其特征在于，步骤S1中所述的内部状态模块用于管理应用的状态和当前的编辑信息，所述内部状态模块具备数据驱动能力，当视图编辑器的内部状态发生变化时，内部状态模块驱动渲染器重新渲染并更新视图；
3.根据权利要求2所述的基于Mock的数据调试方法，其特征在于，所述内部状态模块的数据驱动能力是指追踪数据的变化进而驱动视图更新的能力，该能力通过前端框架Vue、React、或者观察-订阅者模式的程序来实现。
4.根据权利要求2所述的基于Mock的数据调试方法，其特征在于，步骤S1中所述的各组件的字段包括：页面的结构、页面的事件、页面的生命周期、组件的入参、组件的样式、组件的样式名称、渲染组件、组件的子节点。
5.根据权利要求2所述的基于Mock的数据调试方法，其特征在于，步骤S2中包括：
6.根据权利要求5所述的基于Mock的数据调试方法，
7.根据权利要求5所述的基于Mock的数据调试方法，其特征在于，步骤S3中所述的组件渲染器需要的信息包括：组件模型指定的渲染组件名称、组件的入参、组件样式、事件属性的处理。
8.根据权利要求7所述的基于Mock的数据调试方法，其特征在于，所述组件的入参绑定页面的数据变量，在组件模型的描述中，体现为组件的某个入参声明了对某个变量的名称引用，组件数据模型层识别出该变量的引用关系并将该字段替换成变量值传递给组件，并在数据变量更新时触发组件的渲染，将新的修改值传入组件内部。
9.根据权利要求7所述的基于Mock的数据调试方法，其特征在于，所述组件入参的处理步骤包括：在处理组件的入参时，根据当前组件模型声明的入参列表进行遍历，检查每个入参值是否绑定了数据变量，如果组件的入参绑定了数据变量，则直接对独立字段中的相应数据变量进行读取，此步骤执行完成后，组件的入参列表已经被转换成不带有变量名只有变量值的列表，将此入参列表传递给组件，即可完成从数据变量定义到组件渲染的过程。
10.一种计算机可读存储介质，所述存储介质上存储有计算机程序，所述程序被处理器执行时实现权利要求1-9任一项所述的基于Mock的数据调试方法的步骤。
...【技术特征摘要】
1.一种基于mock的数据调试方法，其特征在于，所述基于mock的数据调试方法是针对低代码开发平台前端视图编辑器组件的数据调试方法，本方法包括：
2.根据权利要求1所述的基于mock的数据调试方法，其特征在于，步骤s1中所述的内部状态模块用于管理应用的状态和当前的编辑信息，所述内部状态模块具备数据驱动能力，当视图编辑器的内部状态发生变化时，内部状态模块驱动渲染器重新渲染并更新视图；
3.根据权利要求2所述的基于mock的数据调试方法，其特征在于，所述内部状态模块的数据驱动能力是指追踪数据的变化进而驱动视图更新的能力，该能力通过前端框架vue、react、或者观察-订阅者模式的程序来实现。
4.根据权利要求2所述的基于mock的数据调试方法，其特征在于，步骤s1中所述的各组件的字段包括：页面的结构、页面的事件、页面的生命周期、组件的入参、组件的样式、组件的样式名称、渲染组件、组件的子节点。
5.根据权利要求2所述的基于mock的数据调试方法，其特征在于，步骤s2中包括：
6.根据权利要求5所述的基于mock的数据调试方法，其特征在于，步骤s23中所述的补充或更新独立字段的内容，包括：更新之前检测当前独立字段的值和页面的数据变量是否是拷贝关系，如果是拷贝...
【专利技术属性】
技术研发人员：孙晓杰，林智，
申请(专利权)人：赞同科技股份有限公司，
类型：发明
国别省市：
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。