Configuration
Working with the library configuration is used through the config function:
import {config} from "jenesius-vue-form"
config(params)
import {config} from "jenesius-vue-form"
config(params)
The Params object has the following type:
interface IConfigurationParams {
inputTypes: {
[name: string]: any
},
requiredMessage:string
typeNotCaseSensitive: boolean
debug: boolean
defaultType: string
}
interface IConfigurationParams {
inputTypes: {
[name: string]: any
},
requiredMessage:string
typeNotCaseSensitive: boolean
debug: boolean
defaultType: string
}
inputType Optional
An object to overwrite or define new fields.
To add new or override type used in FormField
you need to specify type name and Vue component:
import NewInputAddress from "./address.vue"
import NewInputText from "./text.vue"
config({
inputTypes: {
address: NewInputAddress, // New field
text : NewInputText // Overridden field
}
})
import NewInputAddress from "./address.vue"
import NewInputText from "./text.vue"
config({
inputTypes: {
address: NewInputAddress, // New field
text : NewInputText // Overridden field
}
})
In this example, we specified a new address field and overridden the existing text type:
<!--Will generate NewInputAddress-->
<input-field type="address" name="some-name-address"/>
<!--Will generate an overridden component-->
<input-field name="new-text-widget"/>
<!--Will generate NewInputAddress-->
<input-field type="address" name="some-name-address"/>
<!--Will generate an overridden component-->
<input-field name="new-text-widget"/>
requiredMessage Optional
When the required parameter is set for a field, the message displayed if the field is not filled in during validation will be Please fill in this field. Set a new value for the given field to override it:
config({
requiredMessage: "This field must be filled."
})
config({
requiredMessage: "This field must be filled."
})
typeNotCaseSensitive Optional
By default, the field type is not case sensitive. The typeNotCaseSensitive property is set to true. In this case the following entry will display three identical input fields:
<input-field name="a"type="test"/>
<input-field name="a" type="Test"/>
<input-field name="a" type="TEST"/>
<input-field name="a"type="test"/>
<input-field name="a" type="Test"/>
<input-field name="a" type="TEST"/>
If this behavior is not suitable for your project, you should set the above parameter to false:
config({
typeNotCaseSensitive: false
})
config({
typeNotCaseSensitive: false
})
debug Optional
To better see what's going on with the form, you can enable the debug option, after which additional output will be displayed in the console information while the form is running:
config({
debug: true
})
config({
debug: true
})
defaultType Optional
The default is text. Stores the name of the type to be used if type is not given in FormField
.