可视化页面搭建与代码生成器

此文章为设计思路,具体实现需根据实际业务情况

可视化场景的分类
  - 可视化自定义表单
  - 可视化自定义报表
  - 可视化大屏
固定场景下的页面开发都会有一些固定的套路

目录持续更新2020.11.24

- 1、配置
- 2、组件的设计拓展
- 3、自定义
- 4、可视化
- 5、应用

配置

组件的设计拓展

可视化

自定义

  • 自定义单元组件
  • 事件交互

应用

思考

页面通过可视化的方式进行组织构建
1、视图与逻辑如何进行融合和分离
2、如何基于现有element 等组件库的基础上去创建节点
3、事件
4、样式
5、数据与请求

需求与设计

1、节点的高度可适配,面向多种同类型组件
2、提炼出关键点,把握灵感,如抽离常用业务场景中的通用组件功能后的不能通用点可以作为一个组件节点进行思考
3、应用方向,页面的快速搭建,前端提效
4、代码生成器-关键点,正向与逆向的结合,节点可以做输入输出的同时也需要又产出真实代码的能力

金点子

  • 组件主题
    组件库的搭建过程中,组件元的配置属性会有一些具有主题特性的属性,例如颜色类,通过指定属性的可选项数组,根据不同主题属性可选区间,组件元件可以在默认的基础上生成多套可用主题。现在所说的主题不局限于颜色,在多个有类似可变属性的组件之间抽离出的'主题属性',都可以作为主题来用。再通过单元测试的功能自动生成不同配置的组件进行截图作为预览。

参考

1、参数配置 http://www.vvveb.com/vvvebjs/editor.html

你可能感兴趣的:(可视化页面搭建与代码生成器)