File tree 6 files changed +40
-0
lines changed
site/content/examples/15-composition
6 files changed +40
-0
lines changed Original file line number Diff line number Diff line change
1
+ <script >
2
+ import Profile from " ./Profile.svelte" ;
3
+ </script >
4
+
5
+ <Profile >
6
+ <span slot =" name" >Bob</span >
7
+ <
span slot =
" email" >
[email protected] </
span >
8
+ </Profile >
9
+
10
+ <Profile >
11
+ <span slot =" name" >Alice</span >
12
+ <span slot =" phone" >12345678</span >
13
+ </Profile >
Original file line number Diff line number Diff line change
1
+ <style >
2
+ section {
3
+ width : 200px ;
4
+ display : grid ;
5
+ grid-template-columns : 1fr 1fr ;
6
+ padding : 16px ;
7
+ box-shadow : 2px 2px 4px #dedede ;
8
+ border : 1px solid #888 ;
9
+ margin-bottom : 16px ;
10
+ }
11
+ </style >
12
+
13
+ <section >
14
+ <div >Name</div >
15
+ <slot name =" name" />
16
+ {#if $$slots .email }
17
+ <div >Email</div >
18
+ <slot name =" email" />
19
+ {/if }
20
+ {#if $$slots .phone }
21
+ <div >Phone</div >
22
+ <slot name =" phone" />
23
+ {/if }
24
+ </section >
Original file line number Diff line number Diff line change
1
+ {
2
+ "title" : " Conditional Slots"
3
+ }
File renamed without changes.
File renamed without changes.
File renamed without changes.
You can’t perform that action at this time.
0 commit comments