custom-module-form v1.0.2

custom-module-form

install

npm install --save custom-module-form

import

import CustomModuleForm from "custom-module-form"

render

  <CustomModuleForm
    option={data}
    layout="vertical"
    labelCol={0}
    wrapperCol={24}
    formName="forms"
    formData={formData}
    onConfirm={handleConfirm}
    onCancel={handleCancel}
    >
    <Input slot={'input'} />
  </CustomModuleForm>

option data

const data = [
  {
    line: 12,
    name: "username",
    types: "input",
    title: "用户名",
    rules: [{ required: true, message: `用户名不能为空` }],
  },
  {
    line: 12,
    name: "select",
    types: "select",
    mode: "multiple",
    title: "水果下拉",
    options: [
      { value: "苹果", label: "苹果" },
      { value: "香蕉", label: "香蕉" },
      { value: "草莓", label: "草莓" },
    ],
    rules: [{ required: true, message: `用户名不能为空` }],
  },
  {
    line: 24,
    name: "fruits",
    types: "checkbox",
    title: "水果",
    options: [
      { value: 1, label: "苹果" },
      { value: 2, label: "香蕉" },
      { value: 3, label: "草莓" },
    ],
    rules: [{ required: true, message: `水果不能为空` }],
  },
  {
    line: 24,
    name: "delivery",
    types: "switch",
    title: "是否选中",
    rules: [{ required: true, message: `是否选中不能为空` }],
  },
  {
    line: 24,
    name: "radio",
    types: "radio",
    title: "单选",
    options: [
      { value: 1, label: "苹果" },
      { value: 2, label: "香蕉" },
      { value: 3, label: "草莓" },
    ],
    rules: [{ required: true, message: `单选不能为空` }],
  },
  {
    line: 24,
    name: "slider",
    title: "拉伸",
    types: "slot",
    slotName: "defaultSlot",
    rules: [{ required: true, message: `拉伸不能为空` }],
  },
  {
    line: 24,
    name: "slotinput",
    title: "行",
    types: "slot",
    slotName: "lineInput",
    rules: [{ required: true, message: `行不能为空` }],
  }
]