The Wayback Machine - https://web.archive.org/web/20200225150320/https://github.com/vuejs/vue/issues/10191
Skip to content

/ vue

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Warn if colon shorthand is used on v-if/v-html/etc. #10191

Open
simonhermann opened this issue Jun 25, 2019 · 6 comments · May be fixed by #10199
Open

Warn if colon shorthand is used on v-if/v-html/etc. #10191

simonhermann opened this issue Jun 25, 2019 · 6 comments · May be fixed by #10199
Labels
contribution welcome feature request good first issue has PR warnings

Comments

@simonhermann
Copy link

@simonhermann simonhermann commented Jun 25, 2019

What problem does this feature solve?

I just spent way too long debugging something really weird until I realized I accidentally wrote :v-if instead of v-if.

A warning when wrongly using shorthands like : on "native" vue attributes could prevent this bad experience easily.

What does the proposed API look like?

:v-if="foo"

--> console.warn("You specified v-bind:/ v-on: or a corresponding shorthand on a Vue attribute like v-if or similar. Usually this does not make sense.)
@posva

This comment has been minimized.

Sign in to view
Copy link
Member

@posva posva commented Jun 25, 2019

I've seen this happen so often when teaching Vue that even though having a prop named vIf is technically valid, I think this warning would help much more people than ever hurt
@simonhermann

This comment has been minimized.

Sign in to view
Copy link
Author

@simonhermann simonhermann commented Jun 25, 2019 •
edited

Yes. If you wanted a prop, why should have the same name as a v-attribute. That'd be incredibly confusing.

<ConfusingComponent 
  v-if="true"
  :v-if="false"
/>
afontcu added a commit to afontcu/vue that referenced this issue Jun 25, 2019
@afontcu
feat: Warn on colon shorthand usage on directive
4da92f0 
fix vuejs#10191
@afontcu afontcu linked a pull request that will close this issue Jun 26, 2019
Open
6 of 12 tasks complete
@posva posva added the has PR label Jun 26, 2019
@chrisdel101

This comment has been minimized.

Sign in to view
Copy link

@chrisdel101 chrisdel101 commented Jun 30, 2019

I'll take this on. It'll be my first issue here.
@posva

This comment has been minimized.

Sign in to view
Copy link
Member

@posva posva commented Jun 30, 2019

Thanks but as the tag suggest there is already a Pull request for this
@zvf618

This comment has been minimized.

Sign in to view
Copy link

@zvf618 zvf618 commented Sep 3, 2019

习惯就好
@WhiteDevill11

This comment has been minimized.

Sign in to view
Copy link

@WhiteDevill11 WhiteDevill11 commented Oct 25, 2019

@simonhermann
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
contribution welcome feature request good first issue has PR warnings
Projects
None yet
Milestone
No milestone
Linked pull requests

Successfully merging a pull request may close this issue.

Warn on colon shorthand usage on directive (fix #10191)
5 participants
@simonhermann @posva @chrisdel101 @zvf618 @WhiteDevill11
You can’t perform that action at this time.