Skip to content

How to access slot content in js template? #105

@awmottaz

Description

@awmottaz

Suppose I'm using a WebC component like this:

<!-- page.webc -->

<my-component>
  My content is here
</my-component>

I want to use JavaScript to generate the output of my-component. How do I access the default slot content (or any named slot for that matter)?

<!-- my-component.webc -->

<script webc:type="js" webc:root>
// How do I use the default slot here?
// This definitely won't work, but illustrates what I'm trying to do
// The output when used like above should be
//   <div>My content is here</div>
`<div>${slot.default}</div>`;
</script>

I could keep everything in attributes and props as a workaround, but for various reasons it would be more ergonomic in my case to use a slot (you get syntax highlighting there, for example).

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions