form 表单

基于 JSON Schema 表单组件，对 element-plus 的 el-form 组件进行高级封装，使用 JSON Schema 和 UiSchema 快速实现表单.

基本使用

名称:

枚举值:

枚举值一枚举值二

多选枚举值:

枚举值一枚举值二

字符串输入:

数字:

价格:

备注:

日期:

时间:

布尔值:

自定义插槽:

自定义渲染:

<template>
  <div>
    <ha-form :schema="demoSchema"
             :model="formModel"
             :ui-schema="formUiSchema"
    ></ha-form>
  </div>
</template>

<script lang="ts" setup>
import { reactive } from 'vue'
import { Schema } from '../../../libs/components/types'
import demoJsonSchema, { demoFormUiSchema, demoModel } from '../demo-json-schema'

const demoSchema = reactive<Schema>(demoJsonSchema)
const formModel = reactive(demoModel)
const formUiSchema = reactive(demoFormUiSchema)
</script>

<style scoped lang="scss">
</style>

显示代码复制代码复制代码

组件 API

Attributes 属性

参数	说明	类型	可选值	默认值

Methods 方法

方法名	说明	参数	返回值

Events 事件

事件名	说明	参数	返回值

Slots 插槽

插槽名	说明	参数