1.3 KiB

Raw Blame History

自定义 FormKit 输入组件

原由

目前在 Console 端的所有表单都使用了 FormKit，但 FormKit 内置的 Input 组件并不满足所有的需求，因此需要自定义一些 Input 组件。此外，为了插件和主题能够更加方便的使用系统内的一些数据，所以同样需要自定义一些带数据的选择组件。

使用方式

目前已提供以下类型：

code: 代码编辑器
- 参数
  1. language: 目前支持 yaml, html, css, javascript, json
  2. height: 编辑器高度，如：100px
attachment: 附件选择
menuCheckbox：选择一组菜单
menuRadio：选择一个菜单
menuItemSelect：选择菜单项
postSelect：选择文章
singlePageSelect：选择自定义页面
categorySelect：选择分类
categoryCheckbox：选择多个分类
tagSelect：选择标签
tagCheckbox：选择多个标签

在 Vue 单组件中使用：

<script lang="ts" setup>
const postName = ref("")
</script>

<template>
  <FormKit
    v-model="postName"
    placeholder="请选择文章"
    label="文章"
    type="postSelect"
    validation="required"
  />
</template>

在 FormKit Schema 中使用（插件 / 主题设置表单定义）：

- $formkit: menuRadio
  name: menus
  label: 底部菜单组