@xuejian/form
v0.1.111
Published
基于 vue3 + Element-Plus + ts 实现的表单组件。
Readme
Form
使用 vue3 ts,基于 element-plus 进行二次封装的 Form 组件,通过简单的 json 配置快速进行表单开发。
安装
NPM
npm install @xuejian/form --saveYarn
yarn add @xuejian/form --save使用
手动导入
<template>
<Input v-model:model-value="modelValue" />
</template>
<script setup lang="ts">
import { Input } from "@xuejian/form"
import { ref } from "vue";
const modelValue = ref('')
</script>完整引入
// main.ts
import Form from "@xuejian/form"
app.use(Form);<template>
<Form :config="config" v-model:model="model"></Form>
</template>
<script setup lang="ts">
import { FormConfigList } from "@xuejian/form/lib/types/Form";
import { reactive } from "vue";
const model = ref({
value: ""
})
const config = reactive<FormConfigList>([
{
label: "标签",
prop: "value",
component: "Input",
placeholder: "请输入"
}
])
</script>