mirror of https://github.com/sveltejs/svelte
parent
b608148238
commit
7fb0683ff6
@ -0,0 +1,9 @@
|
|||||||
|
<script>
|
||||||
|
export let things;
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{#each things as thing}
|
||||||
|
<slot name="foo" {thing}/>
|
||||||
|
{/each}
|
||||||
|
</div>
|
@ -0,0 +1,32 @@
|
|||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
things: [
|
||||||
|
{ klass: 'small', text: 'One',},
|
||||||
|
{ text: 'Two',},
|
||||||
|
{ klass: 'big', text: 'Ten',},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
|
||||||
|
html: `
|
||||||
|
<div>
|
||||||
|
<div slot="foo"><span class="small">One</span></div>
|
||||||
|
<div slot="foo"><span class="no-class">Two</span></div>
|
||||||
|
<div slot="foo"><span class="big">Three</span></div>
|
||||||
|
</div>`,
|
||||||
|
|
||||||
|
test({ assert, component, target }) {
|
||||||
|
component.things = [
|
||||||
|
{ klass: 'small', text: 'One', },
|
||||||
|
{ text: 'Two', },
|
||||||
|
{ klass: 'big', text: 'Ten', },
|
||||||
|
{ klass: 'huge', text: 'Ten Million', },
|
||||||
|
];
|
||||||
|
assert.htmlEqual(target.innerHTML, `
|
||||||
|
<div>
|
||||||
|
<div slot="foo"><span class="small">One</span></div>
|
||||||
|
<div slot="foo"><span class="no-class">Two</span></div>
|
||||||
|
<div slot="foo"><span class="big">Three</span></div>
|
||||||
|
<div slot="foo"><span class="huge">Ten Million</span></div>
|
||||||
|
</div>`);
|
||||||
|
}
|
||||||
|
};
|
@ -0,0 +1,11 @@
|
|||||||
|
<script>
|
||||||
|
import Nested from './Nested.svelte';
|
||||||
|
|
||||||
|
export let things;
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<Nested {things}>
|
||||||
|
<div slot="foo" let:thing class={thing.klass || 'no-class'}>
|
||||||
|
<span>{thing.text}</span>
|
||||||
|
</div>
|
||||||
|
</Nested>
|
Loading…
Reference in new issue