FormRender 一站式中后台表单解决方案 官网 https://xrender.fun/form-render FormRender 是中后台开箱即用的表单解决方案,通过 JsonSchema 协议动态渲染表单。为了能切实承接日益复杂的表单场景需求,2.0 我们进行了底层重构。我们的目标是以强大的扩展能力对表单场景 100% 的覆盖支持,同时保持开发者能快速上手,并以...
极简的组件 api:FormRender 使用上类似一个单独的可控的 input: // 可控的input <input value={value} onChange={onChange} /> // form-render, 只多了schema,用于描述 Form 长什么样 <FormRender formData={value} onChange={onChange} schema={schema} /> 这样的设计下,FR 只负责管理和改动表单数据/时时...
FormRender 是一个通过 JSON Schema 生成标准 Form 的渲染引擎,常用于自定义搭建配置界面生成 0 比如你有想通过一定标准约束自动生成表单配置界面,类似于搭建配置表单界面这种场景,就可以考虑 FormRender,比如这些 在内部实践一年后,也有十多个BU在使用,为了让外部也可以用上,我们于今年10月份对它进行的开源到 alibaba...
form-render的实现原理可以分为三个主要步骤:解析JSON Schema、渲染表单组件、收集表单数据。下面将详细介绍这三个步骤。 form-render需要解析JSON Schema。JSON Schema是一种描述数据结构的规范,它定义了数据的类型、格式、校验规则等信息。form-render通过解析JSON Schema,可以获取到表单的结构信息,包括表单中各个字段的...
FormRender是阿里巴巴飞猪中后台表单开箱即用解决方案,官方给的介绍是像写一个 input 一样写表单。大概功能通过JSON配置就能够生成出表单,这在实际业务上还是很有作用的,比如客户要加个字段去改源码太费劲了,并且性能比手动循环渲染的性能强。FormRender 依赖 ant design,单独使用不要忘记同时安装 antd,就是说...
有function 和 schema2form,支持函数定义,这是面向开发者的。支持 form,让每个函数都可以配置入参,这部分是基于阿里开源的 form-render 实现的。 整个项目难度不大,基于 x6 和 form-render 进一步整合,将写法规范化,将编排工具化,这样克制的设计使得 imove 具备小而美的特点,便于开发使用。
从中我们可以了解到:form-render是基于React框架做的一套表单生成引擎。和自家开源的antd-design组件库比较贴近,在src/widgets目录下存放的就是这两套组件主题库。当然,在Readme.md中也明确指出了这一点: 支持Ant Design 和 Fusion Design 主流的视觉主题 ...
path: 'form-render', title: 'FormRender 表单渲染器', }, { path: 'picker', title: 'Picker 选择器',32 changes: 32 additions & 0 deletions 32 packages/vantui/src/form-render/README.md Original file line numberDiff line numberDiff line change @@ -0,0 +1,32 @@ # form-render ##...
form-render的简单使用心得(FormRender现已升级到XRende)form-render的简单使⽤⼼得(FormRender现已升级到XRende)偶尔⼀次使⽤了,使⽤⽅便简单,通过简单的Schema就可以⽣成表单,很符合数据驱动这⼀理念,基本需求也都能满⾜。但是作为新兴的react第三⽅包,缺点就是互联⽹上相关资料太少,在...
本文来自飞猪前端同学在进行FormRender2.0升级过程中,基于官方的2.0升级方案之上,做的一些差异化总结。 一些关键字处理上的差异 1. description 差异 2.0 的 description 使用了 tooltip 来替代,原有的 description 直接显示在了 label 后,不再用 icon 收拢。1.0 的 description 是在label后新增了一个 icon,鼠标 hov...