vue-form-builder - GitLite

KO | EN

gitlite — search

#javascript #hacktoberfest #typescript #golang #machine-learning #rust #deep-learning #docker #macos #cli #awesome-list #ios #openai #open-source

vue-form-builder

(★ 383)

Build powerful vue form with JSON schema and composition api.

File Explorer

Download Latest Version (.zip)

- config.yml
- - 1-bug-report.md
  - 2-feature-request.md
  - 3-docs-bug.md
- - ghpages.yml
- ISSUE_TEMPLATE.md
- preview.gif
- PULL_REQUEST_TEMPLATE.md
- addons.js
- config.js
- presets.js
- webpack.config.js
- - FormBuilder.vue
- ant-form-adaptor.js
- el-form-adaptor.js
- index.js
- view-form-adaptor.js
- - FormBuilder.md
  - FormBuilder.stories.js
  - style.scss
- - FormBuilder.md
  - FormBuilder.stories.js
  - style.scss
- - FormBuilder.md
  - FormBuilder.stories.js
  - style.scss
- - setup.js
- .eslintrc.js
.browserslistrc
.editorconfig
.eslintignore
.eslintrc.js
.gitignore
.postcssrc.js
.prettierrc
babel.config.js
CODE_OF_CONDUCT.md
codecov.yml
commitlint.config.js
CONTRIBUTING.md
jest.config.js
LICENSE
package.json
README.md
README.zh-CN.md
rollup.config.js

# Installation Guide

1. Get the code

git clone https://github.com/openfext/vue-form-builder

Downloads the entire project code from GitHub to your computer.

cd vue-form-builder

Moves into the project folder you just downloaded.

2. Node.js

Easy Recommended

Prerequisites

Git Needed to download the project code from GitHub.
Node.js Node.js must be installed to use npm. The LTS version is recommended.

npm install

Downloads and installs the libraries listed in package.json.

npm start

Starts the development/run server.

✅ After running the command, open the address shown in the terminal (usually something like http://localhost:3000) in your browser.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Vue Form Builder

[![CircleCI](https://circleci.com/gh/openfext/vue-use.svg?style=svg)](https://circleci.com/gh/openfext/vue-use)
[![codecov](https://codecov.io/gh/openfext/vue-form-builder/branch/develop/graph/badge.svg)](https://codecov.io/gh/openfext/vue-form-builder)
[![License](https://img.shields.io/npm/l/@fext/vue-form-builder.svg)](https://www.npmjs.com/package/@fext/vue-form-builder)
[![Version](https://img.shields.io/npm/v/@fext/vue-form-builder.svg)](https://www.npmjs.com/package/@fext/vue-form-builder)
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](https://github.com/openfext/vue-form-builder)

Build powerful vue form with JSON schema and composition api. Any custom input components and popular ui frameworks such as [Element UI](https://element.eleme.cn/), [View UI](https://www.iviewui.com/), [Ant Design Vue](https://www.antdv.com/) are supported.

:us: English | [:cn: 简体中文](README.zh-CN.md)

## Features

- :tv: **Powerful** - use composition api to manage complex form state
- :camera: **Flexible** - support any custom input components
- :watch: **Adaptable** - different ui frameworks can be used out of the box through the adapters
- :radio: **Reliable** - has been used in multiple applications in the production environment

## Docs

### 🇨🇳 Chinese

- [Introduction](https://openfext.github.io/docs/vue-form-builder/intro.html)
- [Guide](https://openfext.github.io/docs/vue-form-builder/guide/start.html)
- [API Reference](https://openfext.github.io/docs/vue-form-builder/api/component.html)
- [Config Reference](https://openfext.github.io/docs/vue-form-builder/config/schema.html)

### 🇺🇸 English

WIP...

## Example

[:zap: Live Preview](https://openfext.github.io/vue-admin-next/#/form/form-builder) | [:book: Element UI Storybook](https://openfext.github.io/vue-form-builder/?path=/story/formbuilder-element-ui--basic-usage) | [:book: View UI Storybook](https://openfext.github.io/vue-form-builder/?path=/story/formbuilder-view-ui--basic-usage) | [:book: Ant Design Storybook](https://openfext.github.io/vue-form-builder/?path=/story/formbuilder-ant-design-vue--basic-usage)

![Screen Capture](https://github.com/openfext/vue-form-builder/raw/develop/.github/preview.gif)

## Contacts

Welcome to join the group chat to discuss project issues and front-end technologies 💬

### QQ

ChatID: 667576147

![QQGroupQRCode](https://user-images.githubusercontent.com/2902215/84306575-3e785280-ab8e-11ea-8c53-af8620b5cc69.JPG)

### WeChat Group

Add the author's WeChat to get into the group:

![WeChatQRCode](https://user-images.githubusercontent.com/2902215/84306570-3c15f880-ab8e-11ea-9041-8ea4ccbaa772.JPG)

## Built With

- [Vue.js](https://github.com/vuejs/vue)
- [Vue Use](https://github.com/openfext/vue-use)
- [Vee Validate](https://github.com/logaretm/vee-validate)
- [ElementUI](https://github.com/ElemeFE/element)
- [View UI](https://github.com/view-design/ViewUI)
- [Ant Design Vue](https://github.com/vueComponent/ant-design-vue)

## License

[MIT](http://opensource.org/licenses/MIT)

Copyright (c) 2018 - present, Felix Yang