nast-form
Installation
npm i -S nast-form
Prepare
import Vue from 'vue'
import App from './App'
import NastForm from 'nast-form'
Vue.use(NastForm.vue(), {})
new Vue({
render: (h) => h(App),
}).$mount('#app')
Basic usage
<div id="app">
<form @submit.prevent="submit">
{{ $form.errors() }}
<div><input title="Name" :v-bind="$form.input('name')" @input="($event) => change($event, 'name')" /></div>
<div><input title="Email" :v-bind="$form.input('email')" @input="($event) => change($event, 'email')" /></div>
<div><button type="submit">Submit</button></div>
</form>
</div>
export default {
name: 'App',
mounted() {
this.$form.init({
name: '',
email: '',
})
this.$form.rules({
name: [ 'required', ],
email: [ 'email', ],
})
},
methods: {
change(event, name) {
this.$form.set(name, event.target.value)
},
submit() {
if (this.$form.check()) {
console.log(this.$form.get())
}
},
},
}