This is my first attempt to create anything with vue.
Here's a quick JSFiddle demo
I'm trying to create a form that display the values without input, and then clicked, the input will display. I've managed to have a mockup "working", but I'm not very sure if this is the correct approach or not. I'm not very sure about:
Vue.nextTick(function() {
document.getElementById(field.id).focus();
});
On the other hand, is there a recommended input validation library or something?
I would really appreciate any guidelines here :wink:
Thanks!
In Vue. js, we can add an inline style to our element by binding the style attribute in the HTML tag. For reference, :style is shorthand for v-bind:style . Inline styling can be done in two ways: using object syntax or array syntax.
It provides two-way data binding by binding the input text element and the value binded to a variable assigned.
In simple words v-model is for two way bindings means: if you change input value, the bound data will be changed and vice versa. but v-bind:value is called one way binding that means: you can change input value by changing bound data but you can't change bound data by changing input value through the element.
Regarding you first question I don't think there is an issue with using plain javascript to focus on your input. You can also achieve this with vue refs
See updated fiddle
This doesn't look cleaner but with refs you can put what you want as a ref and you are not limited by ids and in the end it's your choice what to use.
Regarding validation libraries here are a few:
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With