Vue.jsでセレクトボックス[select][複数]

2019年5月29日

Vue.jsによるセレクトボックス(選択ボックス)を実装します。

 

1つの値を取得する単一要素と、複数の値を取得する複数要素を実装してみます。

 

 

単一要素

11行目

v-modelディレクティブを利用してデータとバインドします。

 

13〜15行目

optionはデータを配列で用意しているので、v-forディレクティブで表示させています。

 

関連ページ

v-forで配列を表示する

 

 

 

複数要素

11行目

selectタグに「multiple」を指定します。

 

26行目

複数の値を保存するためにバインドする値を配列として用意しています。

 

 

 

LINEで送る
Pocket

Copyright © 2019 思考の葉 All Rights Reserved.  プライバシーポリシー