Open1
Alpine.js V3を触ってみた
Hirano入力フィールドを表示した後、同時にフォーカスを追加する
ボタンをクリックすると、入力フィールドを表示します。
表示完了後に特定の処理を実行したい場合は、$nextTickを使用します。また、DOM要素にアクセスするためにx-refを使用します。
$refsを使用することでx-refで指定した要素を取得できます。
<div x-data="{ show: false }">
<input x-show="show" type="text" id="input" x-ref="input" />
<button @click="show = !show; $nextTick(() => $refs.input.focus());">Button</button>
</div>