Vue Input - Material

The MaterialInput helps you to create different form elements.


Props Information

id*StringUsed to add id to the MaterialInput component. It is a required prop.
typeStringtextUsed to set the type for the MaterialInput component.
placeholderStringUsed to set placeholder to MaterialInput component.
valueStringUsed to set the value for the MaterialInput value attribute.
size'default', 'sm''md''lg'defaultChange the MaterialInput size.
errorboolfalseChange the MaterialInput border color to red, its useful when displaying the error messages.
successboolfalseChange the MaterialInput border color to green, its useful when displaying the success messages.
disabledboolfalseUsed to disable the MaterialInput.
isRequiredboolfalseUsed to make the MaterialInput required.
inputClassstringUsed to add icon to the MaterialInput.
iconstringUsed to add custom class for the MaterialInput's Input.
HTML5 AttributesYou can also use HTML5 input attributes for theMaterialInput.

Input Static

Input Dynamic

Input Outline

Input with Icon