@hzab/form-render-mobile
v1.2.13
Published
formily-form-render-mobile
Downloads
549
Readme
@hzab/form-render-mobile
组件模板
- Node.js ≥ 24
安装
pnpm add @hzab/form-render-mobile本包同时发布到公共 npm(registry.npmjs.org,public access)与企业私有源(ld / old)。
默认源可直接安装,无需额外配置;若团队要求走内网源,见消费方接入指南。
消费方需自备 peerDependencies:@hzab/data-model、@hzab/utils、react、react-dom(本包不会随包安装)。
引入方式见下方「组件」章节。
发布形态:本包在本仓以源码直出方式发布——
main指向src,由消费方打包器编译 TypeScript 与.less样式;@hzab/form-render-mobile/src/*深路径同样可直接引用。随包发布的dist/仅用于 类型解析(types→dist/index.d.ts),不是运行时入口。
注意
- Upload 拍照需要用到 cordova 插件,通过 props.getImgOpt.isMediaCapturePlugin, props.getImgOpt.isCameraPlugin 配置
- isMediaCapturePlugin cordova 插件: cordova-plugin-media-capture
- isCameraPlugin cordova 插件: cordova-plugin-camera
组件
示例
import { useRef } from "react";
import FormRender from "@hzab/form-render-mobile";
import Schema from "./test.schema.json";
export default () => {
const formRef = useRef({
formRender: Object,
});
function onClick() {
console.log(JSON.stringify(formRef?.current?.formRender.values));
}
return (
<div>
<FormRender ref={formRef} schema={Schema} initialValues={ipt:'xxxxssss'} />
<button onClick={onClick}>提交</button>
</div>
);
};API
InfoPanel Attributes
| 参数 | 类型 | 必填 | 默认值 | 说明 | | --------------- | --------------------- | ---- | ------ | ----------------------------- | | schema | Object | 是 | - | 数据信息的 schema | | className | string | 否 | - | 元素类名 | | colon | string/false | 否 | : | 设置 label 后面的符号 | | initialValues | Object | 否 | - | 表单初始值 | | schemaScope | Object | 否 | - | formily scope 自定义数据 | | components | SchemaReactComponents | 否 | - | formily 自定义组件 | | readOnly | boolean | 否 | - | 是否只读 | | disabled | boolean | 否 | - | 是否禁用 | | formOptions | Object | 否 | - | createForm 配置项 | | hasSubmit | boolean | 否 | - | 是否有提交按钮 | | onSubmit | Function | 否 | - | 提交事件 (values): void | | init | Function | 否 | - | 组件初始化 (form): void | | axios | Object | 否 | - | axios | | axiosConf | Object | 否 | - | axios config | | footerRender | Function | 否 | - | 底部渲染插槽 (): ReactElement | | thumbnailParams | string | 否 | - | 缩略图参数 | | selfUrlList | Array | 否 | - | 私有图片链接判断 |
