@decision6/q-formly

A wrapper for vue-formly-quasar theme

Stats

StarsIssuesVersionUpdatedCreatedSize
@decision6/q-formly
5.0.03 years ago4 years agoMinified + gzip package size for @decision6/q-formly in KB

Readme

q-formly

A wrapper for vue-formly-quasar theme.

Requirements

The plugin depends:

Install

yarn add q-formly vue-formly vue-formly-quasar

On main.js on Quasar template:

// code above

import Vue from 'vue'
import Quasar from 'quasar'
import VueFormly from 'vue-formly'
import VueFormlyQuasar from 'vue-formly-quasar'
import QFormly from 'q-formly'

// Install plugins
Vue.use(Quasar)
Vue.use(VueFormly)
Vue.use(VueFormlyQuasar)
Vue.use(QFormly)

// code below

Usage

On template

<q-formly
  :model="model"
  :fields="fields"
  @submit="onSubmit"
  @clear="onClear" />

On script tag

export default {
  data: () => ({
    model: {},
    fields: []
  }),
  methods: {
    onSubmit () {},
    onClear () {}
  }
}

See the complete example and others

QFormly component

Properties

Property Type Required Description
model Object yes Form model
fields Array yes An array of objects with each field on your form.
form Object no An object that will be receive form controls props from formly plugin, like $valid an error object.
forceFormDisable Boolean no Force disable save button

Events

Event Description
@submit Submit form when valid
@clear Function when clear button is clicked

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.