要旨 Vue.js は、サーバー側で生成された HTML 文書の一部をテンプレートとして利用できる。 HTML フォームに含まれるフォーム要素(input 要素、textarea 要素、select 要素等)に v-model 属性を指定すれば、フォームへの入力と Vue コンポーネントのデータが結び付けられる。 しかし、Vue.js はそれらの要素の value, checked または selected 属性の初期値を無視する。 そこで、私はそれらの値を拾い上げて Vue コンポーネントのデータを初期化するプラグインを作成した。 また、私はフォーム要素に設定された name 属性の値から適宜 v-model 属性に値をセットするように拡張されたフォームビルダーを作成し、Gem パッケージとして公開した。 背景 Rails のフォームビルダーで HTML フォームを生成し、jQuery