You can use default and named slots to pass static content to Vue component.
Please note that when using named slots, instead of slot="slotName" you have to use vue-slot="slotName".
Dynamic content woun't work due to fact that when Custom Element register we replace it's HTML with Vue component template.
Use
To use template tags to add content without necessitating the need for an element wrapper, you can follow the pattern:
<template slot id="header">My Content</template>
You would need to add the slot attribute (not a vue-slot) and provide an
id attribute that matches the name of the slot you wish to add
content to.
When passing custom elements inside the slots, you may get warnings about
Unknown custom element. To avoid it, use method described in docs - https://github.com/karol-f/vue-custom-element#caveats.
{{HTML}}
<template>
{{vueTemplate}}
</template>
<script>
{{vueScript}}
</script>
import DemoElement from 'DemoElement.vue';
Vue.customElement('demo-slots', DemoElement);