mirror of https://github.com/sveltejs/svelte
parent
be0a3aafbd
commit
ca0e5df0d8
@ -1,3 +1,8 @@
|
||||
<script>
|
||||
export let w;
|
||||
export let h;
|
||||
</script>
|
||||
|
||||
<div bind:offsetWidth={w} bind:offsetHeight={h}>
|
||||
some content
|
||||
</div>
|
@ -1,2 +1,6 @@
|
||||
<script>
|
||||
export let name;
|
||||
</script>
|
||||
|
||||
<h1>Hello {name}!</h1>
|
||||
{@debug}
|
@ -1,3 +1,7 @@
|
||||
<script>
|
||||
export let createElement;
|
||||
</script>
|
||||
|
||||
{#each createElement as node}
|
||||
<span>{node}</span>
|
||||
{/each}
|
@ -1,2 +1,6 @@
|
||||
<script>
|
||||
export let bar;
|
||||
</script>
|
||||
|
||||
<div data-foo='bar'/>
|
||||
<div data-foo='{bar}'/>
|
@ -1,2 +1,6 @@
|
||||
<script>
|
||||
export let bar;
|
||||
</script>
|
||||
|
||||
<div data-foo='bar'/>
|
||||
<div data-foo='{bar}'/>
|
Before Width: | Height: | Size: 56 B After Width: | Height: | Size: 93 B |
@ -1,3 +1,11 @@
|
||||
<script>
|
||||
export let a;
|
||||
export let b;
|
||||
export let c;
|
||||
export let d;
|
||||
export let e;
|
||||
</script>
|
||||
|
||||
{#each [a, b, c, d, e] as num}
|
||||
<span>{num}</span>
|
||||
{/each}
|
@ -1,3 +1,7 @@
|
||||
<script>
|
||||
export let things;
|
||||
</script>
|
||||
|
||||
{#each things as thing (thing.id)}
|
||||
<div>{thing.name}</div>
|
||||
{/each}
|
@ -1,3 +1,7 @@
|
||||
<script>
|
||||
export let foo;
|
||||
</script>
|
||||
|
||||
{#if foo}
|
||||
<p>foo!</p>
|
||||
{/if}
|
@ -1 +1,7 @@
|
||||
<script>
|
||||
export let color;
|
||||
export let x;
|
||||
export let y;
|
||||
</script>
|
||||
|
||||
<div style='color: {color}; transform: translate({x}px,{y}px);'></div>
|
@ -1 +1,5 @@
|
||||
<script>
|
||||
export let data;
|
||||
</script>
|
||||
|
||||
<div style='background: url(data:image/png;base64,{data})'></div>
|
@ -1 +1,5 @@
|
||||
<script>
|
||||
export let color;
|
||||
</script>
|
||||
|
||||
<div style='color: {color}'></div>
|
@ -1,2 +1,8 @@
|
||||
<div style='{style}'></div>
|
||||
<div style='{key}: {value}'></div>
|
||||
<script>
|
||||
export let style;
|
||||
export let key;
|
||||
export let value;
|
||||
</script>
|
||||
|
||||
<div style={style}></div>
|
||||
<div style="{key}: {value}"></div>
|
@ -1 +1,5 @@
|
||||
<script>
|
||||
export let files;
|
||||
</script>
|
||||
|
||||
<input type="file" multiple bind:files>
|
@ -1 +1,5 @@
|
||||
<script>
|
||||
export let value;
|
||||
</script>
|
||||
|
||||
<input type=range bind:value>
|
@ -1 +1,5 @@
|
||||
<script>
|
||||
export let foo;
|
||||
</script>
|
||||
|
||||
<input type='checkbox' bind:checked={foo}>
|
@ -1 +1,11 @@
|
||||
<script>
|
||||
export let buffered;
|
||||
export let seekable;
|
||||
export let played;
|
||||
export let currentTime;
|
||||
export let duration;
|
||||
export let paused;
|
||||
export let volume;
|
||||
</script>
|
||||
|
||||
<audio bind:buffered bind:seekable bind:played bind:currentTime bind:duration bind:paused bind:volume/>
|
@ -1,3 +1,7 @@
|
||||
<script>
|
||||
export let current;
|
||||
</script>
|
||||
|
||||
<select value={current}>
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
|
@ -1,3 +1,7 @@
|
||||
<script>
|
||||
export let custom;
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>a {custom} title</title>
|
||||
</svelte:head>
|
@ -1,3 +1,7 @@
|
||||
<script>
|
||||
export let y;
|
||||
</script>
|
||||
|
||||
<svelte:window bind:scrollY={y}/>
|
||||
|
||||
<p>scrolled to {y}</p>
|
@ -1 +1,5 @@
|
||||
<script>
|
||||
let foo;
|
||||
</script>
|
||||
|
||||
<Widget bind:foo/>
|
@ -1 +1,5 @@
|
||||
<script>
|
||||
let name;
|
||||
</script>
|
||||
|
||||
<input bind:value={name}>
|
@ -1 +1,5 @@
|
||||
<script>
|
||||
let foo;
|
||||
</script>
|
||||
|
||||
<canvas bind:this={foo}></canvas>
|
Loading…
Reference in new issue