Skip to content

Commit

Permalink
docs: add conditional slot example (#5383)
Browse files Browse the repository at this point in the history
  • Loading branch information
kevmodrome authored Nov 18, 2020
1 parent ddd79e3 commit daec256
Show file tree
Hide file tree
Showing 6 changed files with 40 additions and 0 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<script>
import Profile from "./Profile.svelte";
</script>

<Profile>
<span slot="name">Bob</span>
<span slot="email">[email protected]</span>
</Profile>

<Profile>
<span slot="name">Alice</span>
<span slot="phone">12345678</span>
</Profile>
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
<style>
section {
width: 200px;
display: grid;
grid-template-columns: 1fr 1fr;
padding: 16px;
box-shadow: 2px 2px 4px #dedede;
border: 1px solid #888;
margin-bottom: 16px;
}
</style>

<section>
<div>Name</div>
<slot name="name" />
{#if $$slots.email}
<div>Email</div>
<slot name="email" />
{/if}
{#if $$slots.phone}
<div>Phone</div>
<slot name="phone" />
{/if}
</section>
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"title": "Conditional Slots"
}

0 comments on commit daec256

Please sign in to comment.