Vue: Warn if colon shorthand is used on v-if/v-html/etc.

[simonhermann]

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]

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]

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"
/>

[chrisdel101]

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

[posva]

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

[zvf618]

习惯就好

[WhiteDevill11]

@simonhermann

[oielbanna]

I was going to give it a go but it seems there's a super old PR for this already