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
Named nested slot not working #2312
Comments
Another take: https://jsfiddle.net/simplesmiler/p2oe550c/5/ |
It feels like the named slots still don't work when nested. It's a blocker when developing whole application in .vue files, where main html file only defines overall components composition hierarchy in the application, like so: <app>
<outer-component>
<inner-component></inner-component>
</outer-component>
</app> Here's a fiddle reproducing issue https://jsfiddle.net/plunntic/v2pfj4c4. |
Probably related with #2511 |
@fullfs I'm not really sure if that's directly related. What's not working in #2511 is dynamic slot name resolution, like in v-for (however it works when setting the name explicit, according to what @littlstonee wrote). In my example, it's not working even though the slot name is a absolutely static and explicit string literal. In my opinion, the thing is that there are two components created/indicated by they're custom tags in the main markup ( I've updated the example to demonstrate my theory a little more https://jsfiddle.net/plunntic/v2pfj4c4. Anyway you may be right that's related in some internal way, but i don't think that's the same thing. |
@plunntic Yeah, I see. Unnamed slot seem to accept whatever content is inserted while named slot has restrictions arounnd what elements are checked for having |
@plunntic the Your app3 example is actually not working - it's simply rendering an empty slot followed by the inner3 component. |
@yyx990803 Thanks, it makes sense. So it's basically not possible to attach one component instance to more than one slot? This could be useful if there would be a way to define that But i'm guessing there is a reason for it to not work that way. |
vue nested slot bug
<GlobalSystemGuide2>
<div slot="global-system-guide-slot2">
<SystemGuide
placement="left"
title="title"
:buttons="[]"
:isGuideFinished="false">
<RightSuspension
slot="system-guide-slot"
:isFraud="suspensionObj.isFraud"
:isShowFraud="true"
@change="handleChangeRightSuspension">
</RightSuspension>
</SystemGuide>
</div>
</GlobalSystemGuide2>
<SystemGuide
placement="left"
title="title"
:buttons="[]"
:isGuideFinished="false">
<RightSuspension
slot="system-guide-slot"
:isFraud="suspensionObj.isFraud"
:isShowFraud="true"
@change="handleChangeRightSuspension">
</RightSuspension>
</SystemGuide> |
output:
https://jsfiddle.net/paulpflug/p2oe550c/
The text was updated successfully, but these errors were encountered: