https://github.com/woai3c/vue-form-maker

Vue 表单生成器——动态生成表单组件
https://github.com/woai3c/vue-form-maker

Last synced: about 7 hours ago
JSON representation

Vue 表单生成器——动态生成表单组件

• Host: GitHub
• URL: https://github.com/woai3c/vue-form-maker
• Owner: woai3c
• License: mit
• Created: 2018-12-06T01:39:03.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2024-08-28T04:08:52.000Z (3 months ago)
• Last Synced: 2024-10-01T08:47:41.164Z (about 1 month ago)
• Language: JavaScript
• Homepage:
• Size: 2.05 MB
• Stars: 261
• Watchers: 14
• Forks: 76
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
## 简介

Vue 动态生成表单组件，可以根据数据配置表单，使用的UI库是[iView](https://www.iviewui.com/)。

有问题或BUG欢迎提 [issues](https://github.com/woai3c/vue-form-maker/issues)

* [文档](https://github.com/woai3c/vue-form-maker/blob/master/doc.md)

* [在线DEMO](https://github.com/woai3c/vue-form-maker/blob/master/demo.md)

## 表单组件

* Input 输入框

* Button 按钮

* Radio 单选框

* Checkbox 多选框

* Icon 图标

* Switch 开关

* Select 选择器

* Slider 滑块

* DatePicker 日期选择器

* TimePicker 时间选择器

* Cascader 级联选择器

* InputNumber 数字输入框

* Rate 评分

* Upload 上传

* ColorPicker 颜色选择器

## 使用

### 在单文件组件中引用

```

npm i vue-form-maker

```

```

import VueFormMaker from 'vue-form-maker'

import ViewUI from 'view-design';

import 'view-design/dist/styles/iview.css';

// 如需使用城市数据 可以这样引用

// 省 市 县

import 'vue-form-maker/dist/cityData3Level'

// 省 市

import 'vue-form-maker/dist/cityData2Level'

// 城市数据文件定义了一个全局变量cityData 在项目里直接使用cityData即可

Vue.use(ViewUI)

Vue.use(VueFormMaker)

```

```

    


        

        // 或者 

    


```

### 在HTML文件中直接引用

使用的是dist目录中的`vue-form-maker.js`

```

```

```



    

    



```

```


```

## License

MIT