CommonFormDrawer

@aligov/common-form-drawer

intro component

API

| 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 | | ------------- | ----------------------- | ----- | -------- | -------- | ------------------------ | | visible | 是否显示 | true | boolean | false | | | dialogValue | 表单值 | false | any | | | | title | 标题 | false | string | 编辑数据 | | | mode | 模式 | false | number | 0 | 新增：0 编辑：1 详情：2 | | onOk | 提交函数 | true | Function | 0 | | | onClose | 关闭函数 | true | Function | 0 | | | schema | 表单 schema，同 formily | false | any | | | | submitLabel | 提交按钮文案 | false | string | 保存 | | | customButtons | 底部按钮 | false | any | null | | | children | 子元素 | false | any | null | 不用 schema 的话写 Field |

用法

配合@aligov/use-drawer-hook 使用更佳

import React, { Component } from "react";
import ReactDOM from "react-dom";
import {
  SchemaMarkupField as Field,
  createFormActions,
  FormEffectHooks,
} from "@formily/next";
import { Input } from "@formily/next-components";
import CommonFormDrawer from "@aligov/common-form-drawer";

class App extends Component {
  render() {
    return (
      <div>
        <CommonFormDrawer
          visible={false}
          components={{ Input }}
          onOk={console.log}
        >
          <Field
            name="name"
            title="Field用法"
            type="string"
            required={true}
            x-component="Input"
          />
        </CommonFormDrawer>
        <CommonFormDrawer
          visible
          components={{ Input }}
          onOk={console.log}
          schema={{
            type: "object",
            "x-component-props": {
              labelCol: 7,
              wrapperCol: 12,
            },
            properties: {
              string: {
                type: "string",
                title: "Schema用法",
                "x-component": "Input",
              },
            },
          }}
        />
      </div>
    );
  }
}

ReactDOM.render(<App />, mountNode);