❌ 非推奨

Naive Copy

v-model (input event) で値をそのままコピーする誤ったアプローチ。漢字確定後の文字をコピーするため、ふりがなフィールドに漢字が入ります。なぜ compositionupdate が必要かを確認するための逆説デモ。

意図的に壊れています。氏名フィールドに「田中太郎」と入力してください — ふりがなに「田中太郎」（漢字）がコピーされます。これが compositionupdate なしの限界です。
なぜ壊れるのか

なぜ壊れるのか

// ❌ broken — gets kanji, not the kana reading
const name = ref('')

// v-model fires AFTER kanji is committed — reading is already gone
// <input v-model="name" />
// <input :value="name" readonly />  ← copies 田中太郎, not たなかたろう

日本語 IME は「ローマ字入力 → ひらがな変換 → 漢字候補選択」の3ステップで文字を確定します。v-model / v-model (input event) が値を受け取るのは漢字確定後なので、この時点ではもう読み（ひらがな）の情報はありません。

IME の各ステップのイベント:

  • compositionstart — IME 入力開始
  • compositionupdate — ひらがな読みがここにある（例: "たなか"）
  • compositionend — 漢字確定（例: "田中"）
  • input — ← v-model / v-model (input event) はここ。もう漢字しかない

解決策: compositionupdate のイベントデータがひらがなの間だけ読みを記録する。これが useAutoKana Composable が行っていること。