@ezijing/vue-form
Version:
基于Vue Element-UI的表单
77 lines (56 loc) • 2.08 kB
Markdown
# vue-form
## 安装
```
npm install @ezijing/vue-form --save
```
或
```
yarn add @ezijing/vue-form --save
```
## 使用
### 全局使用
```
import VueForm from 'vue-form'
Vue.use(VueForm)
```
### 组件中使用
```
<template>
<vue-form :model="formModel" :items="formItems" />
</template>
<script>
import VueForm from 'vue-form'
export default {
components: { VueForm },
data() {
return {
formModel: {
name: ''
},
formItems: [
{
type: 'input',
model: 'name',
placeholder: '请输入昵称'
}
]
}
}
}
</script>
```
## 属性
### From 属性
| 属性 | 类型 | 说明 |
| --------- | -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `options` | `Object` | el-form 属性配置参考:[https://element.eleme.cn/#/zh-CN/component/form#form-attributes](https://element.eleme.cn/#/zh-CN/component/form#form-attributes) |
| `model` | `Object` | 数据模型 |
| `items` | `Array` | 表单项 |
### Form-Item 属性
参考:[https://element.eleme.cn/#/zh-CN/component/form#form-item-attributes](https://element.eleme.cn/#/zh-CN/component/form#form-item-attributes)
## 方法
参考:[https://element.eleme.cn/#/zh-CN/component/form#form-methods](https://element.eleme.cn/#/zh-CN/component/form#form-methods)
## 事件
| 事件名 | 返回值 | 说明 |
| -------- | ------------------------------ | ---- |
| `submit` | 类型:`Object`; 说明:数据模型 | 提交 |