UNPKG

jenesius-vue-form

Version:

Heavy form system for Vue.js

58 lines (39 loc) 2.52 kB
<p align="center"><a href="https://form.jenesius.com/" target="_blank" rel="noopener noreferrer"><img height="100" src="https://form.jenesius.com/logo.svg" alt="Vue logo"></a></p> <p align="center"> <a href="https://img.shields.io/npm/dm/jenesius-vue-form"><img src="https://img.shields.io/npm/dm/jenesius-vue-form" alt="Downloads"></a> <a href="https://img.shields.io/npm/dt/jenesius-vue-form"><img src="https://img.shields.io/npm/dt/jenesius-vue-form" alt="Downloads"></a> <a href="https://github.com/Jenesius/vue-form/actions/workflows/node.js.yml/badge.svg"><img src="https://github.com/Jenesius/vue-form/actions/workflows/node.js.yml/badge.svg" ></a> <a href="https://img.shields.io/github/issues/Jenesius/vue-form"><img src="https://img.shields.io/github/issues/Jenesius/vue-form" alt="Issue"></a> <a href="https://img.shields.io/github/stars/Jenesius/vue-form"><img src="https://img.shields.io/github/stars/Jenesius/vue-form" alt="Stars"></a> </p> # Jenesius Vue Form Powerful system for working with forms and inputs. The deep library integrates with Vue (**3 version only**) and provides a large set of tools for working with forms. ## Documentation To check out [live examples](https://form.jenesius.com/examples/list.html) and docs, visit [form.jenesius.com](https://form.jenesius.com/). ## Integration with other UI libraries This section is described in this part of the [documentation](https://form.jenesius.com/guide/third-party-libraries.html) ## Questions and Issues For questions and support please use [the GitHub repo](https://github.com/Jenesius/vue-form). ## Quick Example ![Alt Text](./readme-example.gif) ## Usage This example demonstrates a simple use of this library using the login form as an example. ```vue <template> <form-field name = "login"/> <form-field name = "password" type = "password"/> <button @click = "handleLogin">Login</button> </template> <script setup> import {FormField, Form} from "jenesius-vue-form"; const form = new Form(); function handleLogin() { console.log(form.values) // { login: "", password: "" } } </script> ``` We connected two fields (login, password), arranged the corresponding types of provided libraries, industrial-level instances. a form and creating a handler for entering which takes on the value of the form. This is an example of the simplest form of use. ## License [MIT](https://opensource.org/licenses/MIT) Copyright (c) 2022-present, Jenesius