You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.
Check that this is a concrete bug. For Q&A open a GitHub Discussion.
So, I think the long and the short is that documentation is currently wrong (or this is a legit bug). It says:
When using with Options API, you will need to define createReusableTemplate outside of the component setup and pass to the components option in order to use them in the template.
This seems to work only if your template is not bound to the state of the current instance, as it's defined outside of the setup process.
Here is the corrected code (using setup properly, similar to <script setup>) that should be in the example:
That said, maybe there's another way to pass in components that would correctly re-use slots from the parent? 🤷♂️ It's possible that these components are just defined incorrectly, and are somehow memo-izing what's being passed into the slot? I feel like other components passed to the Options API handle slotted content correctly, but DefineTemplate is effectively already "re-using" content so I wonder if that re-use logic is just wrong.
createReusableTemplate creates a ref on this line.
DefineTemplate sets the render value on this line.
ReuseTemplate does nothing except return the value of render.value on this line.
Therefore, by calling createReusableTemplate outside of the setup function, it creates one instance of render.value across all instances (that are using the Options API).
The way you could make this work according to the example, might be something like the following:
Create a WeakMap in createReusableTemplate that maps instances to render values
Describe the bug
If
<DefineTemplate>
has a slot, this slot will be re-used between component instances.Reproduction
https://stackblitz.com/edit/vitejs-vite-hrgeva?file=src%2FApp.vue,src%2FMyComponent.vue
System Info
Used Package Manager
npm
Validations
The text was updated successfully, but these errors were encountered: