介绍
json to render 是一个前端界面渲染库，采用 vjform 的思想使用 typescript 重构，可以将 json 定义渲染成可交互界面，目前提供基于 vue3 版本支持
支持任何 html 标签和组件库以及自定义组件
开发动机
json 数据的限制
json 是一种在前端开发中广泛应用的数据格式，但 json 数据具有局限性，描述对象时 json 只能使用几种基本类型数据作为对象属性值，而且 json 数据无法表示属性与数据之间的关联关系以及函数，json 不是 js 对象存储时特殊属性值会丢失
组件库限制
常规的 json 动态渲染库一般都是基于某个组件库开发或提供一组固定的组件支持，如果想支持新的组件库或新的组件则需要额外开发
基于 vue2 的版本
之前开发过基于 vue2 的动态渲染组件 vjform 以及设计器 vjdesign，由于 vue2 和 vue3 存在一些本质的区别，例如数据变化的监听方式，而且 vue3 基于 Proxy 的实现也给动态渲染提供了一个思路，优化以前的实现
目标及特性
json to render 的核心思想主要有两点：
- 解析 json 数据特殊定义，用来表示组件属性与数据的关联关系、联动关系以及数据计算处理
- 在渲染前根据特殊条件对 json 进行操作，实现自定义的规则
要实现的目标包括：
- 通过 json 动态渲染界面（必要）
- 支持通过 json 渲染任何 html 标签、组件库、自定义组件（必要）
- 通过特定表达式表示数据与组件属性的关联关系和函数的定义（必要）
- 通过二次开发支持更多的表达式解析方式和渲染前对 json 数据的处理方式（必要）
- 可视化设计器（计划中）
- react 支持（计划中）
- angular 支持（计划中）
它是如何工作的?
界面元素被定义成组件，每个组件包含组件的属性和子集，用专门的 Node 节点根据当前节点的 json 数据处理每个组件的渲染，在渲染之前利用 Proxy 将节点数据转换成代理对象，节点属性值如果是特殊的定义格式（比如关联关系、函数）则会在渲染时将定义转换成真实结果，在渲染前也允许对 json 数据进行改变，实现只操作 json 数据就可以改变最终渲染结果