vuejs / core

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
https://vuejs.org/
MIT License
47.9k stars 8.36k forks source link

$el is typed as any #7915

Open DellCliff opened 1 year ago

DellCliff commented 1 year ago

Vue version

3

Link to minimal reproduction

https://sfc.vuejs.org/#eNpVUcFOwzAM/RUTIXWTWCquWzeE4MAfcMlltO7WKXGixNmQqv47TjcmOLXP7/n52RnVawj6nFGtVZPaOASGhJzDztDggo8MI0TsYYI+egeVSCtDhlpPicGlA2wLv6g+0FoPnz7a7qFaGmrqq50YCWB0we4ZBQE0x+fdOM7N09TUgubqQCEznFfOd2i3RglvlFBNfe9WT+qaauX2QZ+SJ8k9lm5zI5JRa5grpSZpCzbqyBzSuq5T35ZtT0n7eKjlT8dMPDjUmNzqK/pLwijGRhWLydAkI8uJOMmk+0U67AfCNy+YkPjfdTZlYfyelaLbZzt//+oXc8BWYGbsfuN2vs2usMv7AhzlLSIBH4ekH9G+aH8hjO83pYwqMol5zbrcqOkHn+mgyA==

Steps to reproduce

this.$el has the any type

What is expected?

this.$el has the Node | undefined type

What is actually happening?

this.$el has the any type

System Info

No response

Any additional comments?

$el is defined at runtime-core/src/componentPublicInstance.ts line 197

mmis1000 commented 1 year ago

I think it's indeed any. Or, to make it safer, unknown. Vue 3 didn't require element to meet specified interface because implementation of node operations is specified outside of runtime-core

https://github.com/vuejs/core/blob/main/packages/runtime-dom/src/nodeOps.ts

The $el can be whatever you want if you are in other runtime.

baiwusanyu-c commented 1 year ago

I agree with @mmis1000 , I also think it should be any. You must know that Vue supports custom renderers, which makes the content rendered by components not necessarily standard dom elements

DellCliff commented 1 year ago

Maybe adjust the documentation at https://vuejs.org/api/component-instance.html#el to reflect that? It states that $el is Node | undefined.

mmis1000 commented 1 year ago

Wondering if it is possible to left it as a blank interface and argument in runtime-dom.

Like what express.js does

https://stackoverflow.com/questions/37377731/extend-express-request-object-using-typescript

In this way, if you don't have runtime-dom installed. It is {}. Or if you have, it will suddenly be Node