form-create

# Global API

Call method:

Global

formCreate.parseJson(json)

Vue

vm.$formCreate.parseJson(json)

# create

  • Type:Function

  • Parameters:

    • Array rules
    • Object options

  • Return value：

    • Object fApi

  • Description: Generate form

  • Usage：

    const fApi = formCreate.create(rules, options)

# use v2.5.0+

  • Type：Function

  • Parameters：

    • Function|Object rules

  • Description：

    Install the formCreate plugin. If the plug-in is an object, the install method must be provided. If the plugin is a function, it will be used as the install method. When the install method is called, formCreate is passed in as Parameters.

    This method needs to be called before the form is generated.

# init

  • Type：Function

  • Parameters：

    • Array rules
    • Object options

  • Return value：

    • Function mount
    • Function remove
    • Function destroy
    • Object $f

  • Description：Create a form builder

  • Usage：

    const {$f,mount,remove,destroy} = formCreate.init(rules,options) 

//Mount the form to #app
mount(document.getElementById('app'))
//Destroy form
remove()

# component

  • Type：Function

  • Parameters：

    • string id
    • Object component

  • Description：Mount custom components in form-create

  • Usage：

    //Mount
formCreate.component('test',component)
//Get Component
const component = formCreate.component('test')

# directive v2.5.0+

  • Type：Function

  • Parameters：

    • string id
    • Object directive

  • Description：Mount custom directive in form-create

  • Usage：

    //Mount
formCreate.directive('test',directive)

# register v2.5.0+

  • Type：Function

  • Parameters：

    • string id
    • Object effect

  • Description：Mount custom attribute extension

  • Usage：

    //Mount
formCreate.register(effect)

# createParser < v2.5.0

  • Type：Function

  • Return value：

    • Parser parser

  • Description: Create a new component parser

  • Usage：

    const Parser = formCreate.createParser()

# setParser < v2.5.0

  • Type：Function

  • Parameters：

    • string componentName
    • Parser parser

  • Description：Bind a component parser

  • Usage：

    const Parser = formCreate.createParser()
Parser.prototype.toFormValue = (value)=>parseFloat(value)||0

formCreate.setParser('inputNumber',Parser)

# parser v2.5.0+

  • Type：Function

  • Parameters：

    • Object parser

  • Description：Bind a component resolver

  • Usage：

    formCreate.parser({
    name:'input',
    toFormValue(val){
        return parseFloat(val)||0
    }
})

# maker

  • Type：Object

  • Description：Maker

  • Usage：

    rule = maker.input('testTitle','testField','testValue')

# componentAlias v2.5.0+

  • Type：Object

  • Description：Set the alias of the component

  • Usage：

    formCreate.componentAlias({btn:'ElButton'})

# $form

  • Type：Function

  • Description: Bind a component parser

  • Usage：

    $formCreate = formCreate.$form()

//Partial mount formCreate
new Vue({
    components:{
      'form-create':$formCreate
    }
})

//Global mount
Vue.component('form-create',$formCreate)

# parseJson v0.0.4+

  • Type：Function

  • Parameters：

    • String json
    • Boolean mode v1.0.5

  • Description：Convert json to generation rules, add a second parameter for backward compatibility, use the new version to parse when mode:true (version>1.0.5 recommends that the second parameter is fixed to true)

  • Usage：

     const json = fApi.toJson()
 const rule = formCreate.parseJson(json, true)

# toJson v2.5.3+

  • Type：Function

  • Parameters：

    • String Rule[]
    • string | number space

  • Description：Convert the specified generation rules to JSON

# fetch v2.5.3+

  • Type：

    type fetch = (options: {
  action: String;
  //Request method
  method?: String;
  //Call interface with data
  data?: Object;
  //Call the method of submitting data attached to the interface,The default is `formData`
  dataType?: 'json';
  //Custom header information
  headers?: Object;
  //Callback for successful interface call
  onSuccess: (body: any) => void
  //Interface call failure callback
  onError?: (e: Error | ProgressEvent) => void;
})=> void;

  • Description：Built-in fetch, used to load data

# copyRules v2.5.0+

  • Type：Function

  • Parameters：

    • array rules

  • Description：Copy generation rules

  • Usage：

     const rules = formCreate.copyRules(rules)

# copyRule v2.5.0+

  • Type：Function

  • Parameters：

    • array rule

  • Description：Copy generation rule

  • Usage：

     const rule = formCreate.copyRule(rule)

# vm.$formCreate

  • Type：Function

  • Parameters：

    • Array rules
    • Object options

  • Return value：

    • Object $f

  • Property：all of above

  • Description: Generate form

  • Usage：

    new Vue({
  mounted(){
    const fApi = this.$formCreate(rules,options) 
  }
})

← Component event →