Powered by vuejs
Very convenient and simple input fields as a component for vuejs

How to install?

1
step
Write the command
npm i @vgaidadei/inputv
2
step
In the .vue file, which you will use the fields, connect the library using the line
import inputv from '@vgaidadei/input'
3
step
In the .vue file, which you will use the fields, connect the library using the line
import inputv from '@vgaidadei/input'
4
step
Connect the component by adding it to the object for export
export default {
... ,
components: { inputv },
...
}
5
step
Inside the template, insert the inputV tag where needed
<div id='app'>
<inputV type='tel'>
</div>

Video how to install

Documentation

<inputV type='tel' title='Phone number' value='+1|123 456 78-90' />
description:
Phone number input field.
title:
Explanatory note that appears above the field.
value:
Automatically fills in the field value. Sign "|" the country code and number are separated, there must be no space next to this sign. All other spaces and dashes should also be appropriately written.
<inputV type='text' title='Your name' value='Any text' />
description:
Text input field.
title:
Explanatory note that appears above the field.
value:
Automatically fills in the field value.
<inputV type='select' title='Your favorite fruit' value='Any text' other='true' >
  <option>Apple</option>
  <option>Pineapple</option>
  <option>Kiwi</option>
</inputV>
description:
Select input field.
title:
Explanatory note that appears above the field.
value:
Automatically fills in the field value.
other:
If other is true, then you can also enter your own answer. Otherwise, you will only be able to select the one in the list.
<inputV type='checkbox' title='I agree' value='true' />
description:
Checkbox input field.
title:
Explanatory text that appears to the right of the button.
value:
If value is true, then the button is active, otherwise it is inactive.
<inputV type='radio' title='I use ios' anchor='os' />
<inputV type='radio' title='I use android' anchor='os' value='true' />
<inputV type='radio' title='I use an another os' anchor='os' />
description:
Radio input field.
title:
Explanatory text that appears to the right of the button.
anchor:
This attribute binds buttons together. Among the buttons with the same anchor value, only one can be active.
value:
If the value is set true, then this button is active. If several buttons with the same anchors are set true, then the first one is active.