vue.js で select の値を取得する方法 (詳細なチュートリアル)-jsチュートリアル-php.cn

vue.js で select の値を取得する方法 (詳細なチュートリアル)

亚连

リリース： 2018-06-02 10:17:31

オリジナル

8211 人が閲覧しました

ここで、select で値インスタンスを取得するための vue.js に関する記事を共有します。これには優れた参考値が含まれているので、皆さんのお役に立てれば幸いです。

以下に示すように:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="./vue.js"></script>
</head>
<body>
<label id="app">
<select v-model="selected" >
 <option v-for="option in options" v-bind:value="option.value">
 {{ option.text }}
 </option>
</select>
<span>Selected: {{ selected }}</span>
</label>
<script>
new Vue({
 el: &#39;#app&#39;,
 data: {
 selected: &#39;A&#39;,
 options: [
  { text: &#39;One&#39;, value: &#39;A&#39; },
  { text: &#39;Two&#39;, value: &#39;B&#39; },
  { text: &#39;Three&#39;, value: &#39;C&#39; }
 ]
 }
})
</script>
</body>
</html>

ログイン後にコピー

上記は、私が皆さんのためにまとめたものです。将来的に皆さんのお役に立てれば幸いです。

Vueでコンポーネントの外側をクリックしてコンポーネントを閉じる方法について(詳細チュートリアル)

Vueを使ったルーティング権限管理の問題点(詳細チュートリアル)

vue.jsの使い方についてタグ変数パラメーターを属性に挿入する方法 (詳細なチュートリアル)

以上がvue.js で select の値を取得する方法 (詳細なチュートリアル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。