Web 应用程序的数据驱动表单
Data driven forms for a web application
我有一个 Web 应用程序,其中某些字段会因租户而异,例如有些物品可能看起来像:
{
"name": "John Smith",
"age": 20
}
但另一个租户的数据可能具有如下形状:
{
"name": "John Smith",
"age": 20,
"preference": 1
}
每个租户都已经通过 JSON 模式定义了字段,并且已经过验证。使用自定义的 Mustache 模板在前端呈现数据,该模板也为每个租户指定。
但是,我想启用一些可以根据需要自定义的自定义表单定义。例如,对于第二个租户,他们可能希望 preference
字段是解析为 number
.
的表单输入
另一个租户可能希望 preference
字段设置为具有预定选项的单选按钮。
是否有任何现有的数据驱动表单解决方案,我可以公开表单模板并允许每个租户编辑他们自己的 UI?
我看到您需要使用 React 创建一个基于 JSON 架构的表单,其中包含额外的表单字段。
你应该检查 React JSON Schema Form
这需要您 JSON 模式、UI 模式和您的值,并根据它呈现一个表单。
希望对您有所帮助!
另一种方法是 Angular Dynamic Forms
我有一个 Web 应用程序,其中某些字段会因租户而异,例如有些物品可能看起来像:
{
"name": "John Smith",
"age": 20
}
但另一个租户的数据可能具有如下形状:
{
"name": "John Smith",
"age": 20,
"preference": 1
}
每个租户都已经通过 JSON 模式定义了字段,并且已经过验证。使用自定义的 Mustache 模板在前端呈现数据,该模板也为每个租户指定。
但是,我想启用一些可以根据需要自定义的自定义表单定义。例如,对于第二个租户,他们可能希望 preference
字段是解析为 number
.
另一个租户可能希望 preference
字段设置为具有预定选项的单选按钮。
是否有任何现有的数据驱动表单解决方案,我可以公开表单模板并允许每个租户编辑他们自己的 UI?
我看到您需要使用 React 创建一个基于 JSON 架构的表单,其中包含额外的表单字段。
你应该检查 React JSON Schema Form
这需要您 JSON 模式、UI 模式和您的值,并根据它呈现一个表单。
希望对您有所帮助!
另一种方法是 Angular Dynamic Forms