svelte5の$stateをexportする の履歴(No.1)

概要†

svelte5 ではおまじない(Rune)付きの変数はリアクティブになる。

<script>
let title=$state("こんにちは"); // こちらは変更のたびリアクティブに表示が変化する
let title2="こんにちは";        // こちらは変更が表示の更新をトリガーしない
</script>
<h1>{title}</h1> <!-- 変化する -->
<button onclick={()=> title='クリックしましたね？'}>クリック</button>

<h1>{title2}</h1> <!-- 変化しない -->
<button onclick={()=> title2='クリックしましたね？'}>クリック</button>

試すにはこちら