将默认的schema或者后端返回的schema在页面展示,可进行表单提交
import { useEffect, } from 'react';
import { useDispatch } from 'umi';
import { Button } from 'antd';
import FormRender, { useForm } from 'form-render';
const schema = {
type: 'object',
properties: {
input1: {
title: '简单输入框',
type: 'string',
required: true,
},
select1: {
title: '单选',
type: 'string',
enum: ['a', 'b', 'c'],
enumNames: ['早', '中', '晚'],
},
},
};
const NewsManage = () => {
const form = useForm();
const dispatch = useDispatch()
const onFinish = (formData, errors) => {
console.log('formData:', formData, 'errors', errors);
};
useEffect(() => {
dispatch({
type: 'designServe/getFormList',
});
},[])
return (
<div>
<FormRender form={form} schema={schema} onFinish={onFinish} />
<Button type="primary" onClick={form.submit}>
提交
</Button>
</div>
);
};
export default NewsManage;
说明:官网纯demo展示,未进行深度探索,待更新