@hzab/form-render-mobile

组件模板

• [email protected]

注意

• 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 | 否 | - | 私有图片链接判断 |

组件开发流程

• 在 config/webpack.config.js 中按需修改 library 配置的文件名
• 在 config/webpack.config.js 中按需修改 alias 配置的包名，便于本地调试
• 在 tsconfig.json 中按需修改 paths 配置的包名，解决 ts 报错问题
• npm run dev

文件目录

• example 本地开发测试代码
• src 组件源码

命令

• 生成文档：npm run docs
• 本地运行：npm run dev
• 打包编译：npm run build

发布

• npm 源和云效源都需要发布

• 命令：npm publish --access public

• 发布目录：

  • src

nrm

• 安装 npm install -g nrm
• 增加源 nrm add aliyun https://packages.aliyun.com/62046985b3ead41b374a17f7/npm/npm-registry/
• 切换源 nrm use aliyun nrm use npm
• 登录（账号密码在 https://packages.aliyun.com/npm/npm-registry/guide 查看） npm login --registry=https://packages.aliyun.com/62046985b3ead41b374a17f7/npm/npm-registry/

配置

配置文件

• 本地配置文件：config/config.js

webpack 配置文件

• config/webpack.config.js