Logicky Blog

Logickyの開発ブログです

SvelteKitで親コンポーネントから子コンポーネントの関数を実行する

子コンポーネントで、関数を export しておきます。

Child.svelte

<script lang="ts">
  export const hoge = () => {
    console.log("hoge");
  }
</script>

<div>Child</div>

親コンポーネントから子コンポーネント利用する際に、下記のように子コンポーネントの関数を bind します。

+page.svelte

<script lang="ts">
  import Child from 'components/Child.svelte';
  let hoge = () => {};
</script>

<Child bind:hoge />
<button on:click={hoge}>push</button>

このコードは試してないですが、大体こんな感じでできます️ 😊