script setup make normal script exception
Vue version
3.2.37
Link to minimal reproduction
Steps to reproduce
- use both script setup and script normal
- write some code in script setup, make this sciprt setup is not empty
- declare any variable top level in script normal
- declare same property in data options api
- use it in template
What is expected?
expect to used the property in data options api, but not the top level variable in script normal
What is actually happening?
template used top level variable in script normal property with the same name in the options API does not work
System Info
No response
Any additional comments?
To me this is expected behaviour. script setup makes all top-level variables available in the template. That would take precedence over this Options API data option.
Sidenote: Mixing the options API with script setup is absolutely no recommended, and was not an intended use case that we had in mind or seriously tested for when designing this. Yes, technically it kinda works as a side-effect of the implementation, but our recommendation is: Do not ever mix Options API and script setup
, except for the few actual config properties that do not have a counterpart, like inheritAttr: false
.
We might in fact throw warnings during development for invalid usage like this one in future minor version.