Part 3 / Advanced bindings / Component bindings

DOM 要素のプロパティにバインドできるのと同様に、コンポーネントの props にもバインドできます。例えば、フォーム要素のように <Keypad> コンポーネントの value prop にバインドすることができます。

<Keypad
	bind:value={pin}
	on:submit={handleSubmit}
/>

これで、ユーザがキーパッドを操作すると、親コンポーネントの pin の値が即座に更新されるようになりました。

コンポーネントバインディングは控えめに使用してください。それらが多すぎるとアプリケーションの周りのデータの流れを追跡するのが困難になります。特に「信頼できる唯一の情報源(single source of truth)」が存在しない場合には。