|
|
|
|
@ -44,39 +44,3 @@
|
|
|
|
|
|
|
|
|
|
<CounterContext />
|
|
|
|
|
<CounterBinding bind:linked3={linked3.current} bind:linked4={linked4.linked.current} />
|
|
|
|
|
|
|
|
|
|
<!-- <script>
|
|
|
|
|
import { createPortalKey } from 'svelte';
|
|
|
|
|
let x = createPortalKey();
|
|
|
|
|
let count = $state(0);
|
|
|
|
|
let root = $state();
|
|
|
|
|
|
|
|
|
|
$effect(() => {
|
|
|
|
|
root = document.querySelector('#root');
|
|
|
|
|
})
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
<svelte:portal for={x}></svelte:portal>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<button onclick={() => count++}>increment</button>
|
|
|
|
|
|
|
|
|
|
<svelte:portal target={x}>
|
|
|
|
|
hello {count}
|
|
|
|
|
</svelte:portal>
|
|
|
|
|
|
|
|
|
|
{#if count < 5}
|
|
|
|
|
<svelte:portal target={x}>
|
|
|
|
|
<span>hello2 {count}</span>
|
|
|
|
|
</svelte:portal>
|
|
|
|
|
{/if}
|
|
|
|
|
|
|
|
|
|
<p></p>
|
|
|
|
|
|
|
|
|
|
<svelte:portal target="{root}">
|
|
|
|
|
I'm rendered in the
|
|
|
|
|
<button onclick={() => root = document.querySelector('p')}>
|
|
|
|
|
{root === document.querySelector('#root') ? 'root' : 'p'}
|
|
|
|
|
</button>
|
|
|
|
|
</svelte:portal> -->
|
|
|
|
|
|