Skip to main content
added 517 characters in body
Source Link
Saroj Bera
  • 14.8k
  • 2
  • 20
  • 37

Use <slot></slot> to pass HTML markup from parent to child Lightning Web Component.

Child

<template>
    <h4>This is a child component</h4>
    <slot name="slot1"></slot>
    <slot name="slot2"></slot>
</template>

Parent

<template>
    <c-slot-child>
        <div slot="slot1">
            Hello
        </div>
        <div slot="slot2">
            <span>
                <p>
                    World!
                </p>
            </span>
        </div>
    </c-slot-child>
</template>

https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.create_components_slots

Use <slot></slot> to pass HTML markup from parent to child Lightning Web Component.

https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.create_components_slots

Use <slot></slot> to pass HTML markup from parent to child Lightning Web Component.

Child

<template>
    <h4>This is a child component</h4>
    <slot name="slot1"></slot>
    <slot name="slot2"></slot>
</template>

Parent

<template>
    <c-slot-child>
        <div slot="slot1">
            Hello
        </div>
        <div slot="slot2">
            <span>
                <p>
                    World!
                </p>
            </span>
        </div>
    </c-slot-child>
</template>

https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.create_components_slots

Source Link
Saroj Bera
  • 14.8k
  • 2
  • 20
  • 37

Use <slot></slot> to pass HTML markup from parent to child Lightning Web Component.

https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.create_components_slots