Form State Management For Vue – vue-form

Form State Management For Vue – vue-form

Just another form state management library for Vue.js.

vue-form

Form State Management for VueJS

npm version npm downloads MIT license

Installation

npm i @detools/vue-form

Usage

import { Button } from 'element-ui'
import Form, { Input } from '@detools/vue-form'

export default {
  data() {
    return {
      formValues: {},
    }
  },

  methods: {
    handleSubmit(values) {
      this.formValues = values
    },
  },

  render() {
    return (
      <div>
        <h1>Basic Form</h1>
        <div class="wrapper">
          <div class="form">
            <Form cancel submit labelPosition="top" handleSubmit={this.handleSubmit}>
              <Input formItem label name="username" />
            </Form>
          </div>
          <div class="values">
            <strong>Form Values</strong>
            <br />
            <br />
            <div>{JSON.stringify(this.formValues, null, 2)}</div>
          </div>
        </div>
      </div>
    )
  },
}

More Examples

See source in example/src folder.
See demo at https://detools-vue-form.netlify.com

Available Connected Components

Changelog

Github Repository

Tags: #VueJs