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