如何利用React Hooks和zarm组件库高效配置H5表单页面？

本文共计1744个文字，预计阅读时间需要7分钟。

最近使用React Hooks结合zarm组件库，基于JavaScript对象配置方式开发了大量H5表单页面。众所周知，H5表单功能无外乎就是数据收集、验证、提交、回显编辑，以及常见排序方式等。

最近使用React Hooks结合zarm组件库，基于js对象配置方式开发了大量的h5表单页面。大家都知道h5表单功能无非就是表单数据的收集，验证，提交，回显编辑，通常排列方式也是自上向下一行一列的方式显示 ， 所以一开始就考虑封装一个配置化的页面生成方案，目前已经有多个项目基于此方式配置开发上线，思路和实现分享一下。

使用场景

任意包含表单的h5页面（使用zarm库，或自行适配自己的库）

目标

• 代码实现简单和简洁
• 基于配置
• 新手上手快，无学习成本
• 老手易扩展和维护

写之前参考了市面上的一些方案 ，大多都是通过定义json schema方式定义一套格式， 比如阿里的form-render ,通过 JSON Schema定义表单， 有可视化编辑器配置，导出json文件，动态渲染，凡此种种，无出其外。