v-formly-v3
语言: English, 中文 (这个文件).
v-formly-v3 是 vue 3 的动态（JSON 驱动）表单库。
简洁至上
通过标准JSON Schema & Ajv Validator生成复杂的动态表单及校验，快速、简洁、高效。
可复用性
通过JSON的形式生成表单模板，一份表单简单修改即可多处复用！使您能够快速开发表单页面，相比编写传统的html form表单，使用JSON形式定义表单能够极大的提高了开发效率。
Vue 驱动
目前支持Vue 3.x，组件库支持antdv v3 & element-plus，Vue 3.x的其他UI库（DevUI等）支持正在开发中。。。
快速开始
文档 & Demo
Stackblitz antdv， CodeSandbox antdv
Stackblitz element， CodeSandbox element
安装
推荐使用 vite cli 搭建项目
搭建完成后:
使用yarn安装v-formly-v3：
yarn add v-formly-v3或者使用npm安装它：
npm i v-formly-v3 --save使用
基于 antdv v3 组件库
import { createApp } from "vue";
import App from "./App.vue";
import Antd from "ant-design-vue";
import "ant-design-vue/dist/antd.css";
import * as antIcons from "@ant-design/icons-vue";
import VFormly from "v-formly-v3/antdv";
const app = createApp(App);
app.use(Antd);
Object.keys(antIcons).forEach((key) => {
app.component(key, (antIcons as any)[key]);
});
app.config.globalProperties.$antIcons = antIcons;
app.use(VFormly, {
ui: {
errors: {
required: "必填项",
},
},
});
app.mount("#app");基于 element-plus 组件库
import { createApp } from "vue";
import App from "./App.vue";
import ElementPlus from "element-plus";
import "element-plus/dist/index.css";
import * as elIcons from "@element-plus/icons-vue";
import VFormly from "v-formly-v3/element";
const app = createApp(App);
app.use(ElementPlus);
for (const [key, component] of Object.entries(elIcons)) {
app.component(key, component);
}
app.config.globalProperties.$elIcons = elIcons;
app.use(VFormly, {
lib: "element",
ui: {
errors: {
required: "必填项",
},
},
});
app.mount("#app");其他
不论是学习还是使用 v-formly-v3，有任何问题可以添加 QQ 群：610930944，我们为你解答关于使用 v-formly-v3 过程中的的任何疑难杂症！
MIT Licensed | Copyright © 2022-present v-formly-v3