Skip to content
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

Standard HTML attributes on components are interpreted as props and return a warning-like message #710

Closed
robyedlin opened this issue Nov 18, 2021 · 6 comments
Labels
bug Something isn't working

Comments

@robyedlin
Copy link
Collaborator

robyedlin commented Nov 18, 2021

I'm not sure if this is a bug, but I get a Volar message on the class attribute of a component when class is not a defined prop.

<TableRow v-for="item in items" class="text-gray-500">

Hovering over class show the following message:

Property 'class' does not exist on type '{ ... }'. ts(2339)

I'm not 100% sure, but I think that standard HTML attributes on components are expected to pass through to the root element of the component. So I'm not sure if a warning is necessary.

@sethidden
Copy link
Contributor

Works fine for me in the template from npm init vue@next then changed App.vue on line 11 to:

<HelloWorld msg="You did it!" v-for="i in [1,2,3]" class="text-gray-500" />

Can you provide a repo with a minimal repro?

Maybe this'll help, but it's shot in the dark. Throwing it in since it's related to the class/className stuff
#592

Related #552

@robyedlin
Copy link
Collaborator Author

robyedlin commented Nov 19, 2021

@sethidden I repeated your procedure and I got this:

It only returns the warning if props are defined and class or any standard HTML attribute name is not included in the props definition

Screen Shot 2021-11-18 at 11 51 32 PM

This isn't a big deal, but I'm not sure it's a TS 2339 error.

@robyedlin robyedlin reopened this Nov 19, 2021
@sethidden
Copy link
Contributor

sethidden commented Nov 19, 2021

Ah, I can reproduce it too. This happens if you run npm init vue@next and answer "No" to every question it asks you (so also "no" when it asks you if you want to setup TypeScript). Then if you add class="hello" on line 11 you'll have this in App.vue

image

@robyedlin
Copy link
Collaborator Author

@sethidden Actually I can see it when using ts as well.

@johnsoncodehk johnsoncodehk added the bug Something isn't working label Nov 21, 2021
@AlmarAubel
Copy link

AlmarAubel commented Nov 24, 2021

@johnsoncodehk It looks like this issue still exists in version v.0.29.6
image

@johnsoncodehk
Copy link
Member

@AlmarAubel this is a similar but different problem, see #592.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

4 participants