Hey @srikanth597
thanks for reading and participating.
Explaining 1, 2 and 3.
By default, v-model on a component uses value as the prop and input as the event. So that's why I use v-model on <BaseInput /> usage and, inside it, there is a prop called value. The value of the P text variable will be bind directly to the default prop value.
(Check: Customizing Component v-model (VueJS docs))
In regards to 4 and 5, as a component is, by default, a reusable instance Vue, therefore I don't need to define the $emit event manually, because it is already present in the component implicitly.
(Check: Base Example (VueJS docs)
Now, talking about the update event, in both 4th and 5th examples, the model property is responsible to configure the update event, as the one that will update the v-model, which is, in these cases, represented by the text prop.
(Check: Model (VueJS docs
Hey @srikanth597
, in the latest released version of VueJS, v3, it is possible to bind multiple v-model’s
Take a look at this article to understand a bit better.
Hey @srikanth597 thanks for reading and participating.
Explaining 1, 2 and 3.
By default,
v-modelon a component usesvalueas the prop andinputas the event. So that's why I usev-modelon<BaseInput />usage and, inside it, there is a prop calledvalue. The value of the Ptextvariable will be bind directly to the default propvalue.(Check: Customizing Component v-model (VueJS docs))
In regards to 4 and 5, as a component is, by default, a reusable instance
Vue, therefore I don't need to define the$emitevent manually, because it is already present in the component implicitly.(Check: Base Example (VueJS docs)
Now, talking about the
updateevent, in both 4th and 5th examples, themodelproperty is responsible to configure theupdateevent, as the one that will update thev-model, which is, in these cases, represented by thetextprop.(Check: Model (VueJS docs
Cheers!
Thanks for ur reply,
So if I understood correctly Vue automatically figure out v-model='text' as value prop automatically in component definition.
This arises wierd doubt in my mind, what happens if for some reason I want to have 2 v-model properties I need to pass to component.
I understood your 4&5 point explanation
Hey @srikanth597 , in the latest released version of VueJS, v3, it is possible to bind multiple v-model’s
Take a look at this article to understand a bit better.
dev.to/thomasfindlay/how-to-easily...