Vue: Alias for v-on and v-bind

Created on 12 Dec 2018  Â·  6Comments  Â·  Source: vuejs/vue

What problem does this feature solve?

If you've decided to go with v-bind and v-on shorthands then v-on="$listeners" looks out of place and creates a mixture of syntax. Shorthands for v-on and v-bind would solve that issue.

What does the proposed API look like?

v-on="$listeners" should be aliased like this: @="$listeners"

v-bind="$attrs" should be aliased like this: :="$attrs"

feature request

Most helpful comment

I don't think this is a good idea, v-bind= and v-on= do not happen that often to offer a shorthand syntax that is confusing. Having the full text version makes things more readable since it's a v-bind or v-on without argument is so different from one with an argument. So I think having both v-bind and v-on is actually a good thing because they are visible (or _out of place_) while := and @= are not

All 6 comments

I don't think this is a good idea, v-bind= and v-on= do not happen that often to offer a shorthand syntax that is confusing. Having the full text version makes things more readable since it's a v-bind or v-on without argument is so different from one with an argument. So I think having both v-bind and v-on is actually a good thing because they are visible (or _out of place_) while := and @= are not

One great thing about @ and : aliases is that they are instantly recognizable, and I couldn't say that about v-bind and v-on. I would say that it is one of the main reasons people prefer this syntax over the other.

Exactly, so making the non-argument version of v bind and v on also have
that would defeat that purpose
On Wed 12 Dec 2018 at 19:30, Stanislav Lashmanov notifications@github.com
wrote:

One great thing about @ and : aliases is that they are instantly
recognizable, and I couldn't say that about v-bind and v-on. I would say
that it is one of the main reasons people prefer this syntax over the other.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/vuejs/vue/issues/9190#issuecomment-446693311, or mute
the thread
https://github.com/notifications/unsubscribe-auth/AAoicXWTfMCnoMOeeSn0d68iws3SCC0yks5u4Us-gaJpZM4ZPXUa
.

>

Eduardo San Martin Morote

We'll have to agree to disagree on this one. For me mixing @click, @keyup listeners with v-on is hard to digest at a quick glance. Especially if I need to work with native elements' wrappers extensively. If we have all listeners and bindings align to the same semantics that would improve readability, since you don't have to search line by line through all the attributes.

This also goes well with official Vue style guide. Right now you're basically breaking the rule with these directives because you have no other option. The same applies to v-model, but that's another case.

v-on="myListeners" or @="myListeners" How to register native events?

As we discussed a shorthand for v-slot, we also talked about these shorthands not being in line with Vue values of being approachable and intuitive.

More at https://github.com/vuejs/rfcs/pull/3#issuecomment-455332873

Was this page helpful?
0 / 5 - 0 ratings

Related issues

hiendv picture hiendv  Â·  3Comments

6pm picture 6pm  Â·  3Comments

paulpflug picture paulpflug  Â·  3Comments

julianxhokaxhiu picture julianxhokaxhiu  Â·  3Comments

robertleeplummerjr picture robertleeplummerjr  Â·  3Comments