1👍
You can keep the v-if
logic inside the child, but the parent will need to change its syntax and use the explicit named slot form:
<logic-component>
<template #default>
<div>{{ data }}</div>
</template>
</logic-component>
The default slot is actually a named slot with the name "default". By wrapping in an explicit template
, the logic-component
gets a chance to decide when to render it.
Source:stackexchange.com