Heim >Web-Frontend >js-Tutorial >So erhalten Sie den Wert in select in vue.js (ausführliches Tutorial)

So erhalten Sie den Wert in select in vue.js (ausführliches Tutorial)

亚连
亚连Original
2018-06-02 10:17:318261Durchsuche

Jetzt werde ich einen Artikel über vue.js teilen, um die Wertinstanz in select zu erhalten. Es hat einen guten Referenzwert und ich hoffe, dass es für alle hilfreich sein wird.

Wie unten gezeigt:

<!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>

Das Obige habe ich für alle zusammengestellt. Ich hoffe, dass es in Zukunft für alle hilfreich sein wird.

Verwandte Artikel:

Über die Methode zum Schließen einer Komponente durch Klicken außerhalb der Komponente in Vue (ausführliches Tutorial)

Verwenden von Vue's Routing-Berechtigungsverwaltung Fragen zu (ausführliches Tutorial)

Über die Methode zum Einfügen variabler Parameter in vue.js-Tag-Attribute (ausführliches Tutorial)

Das obige ist der detaillierte Inhalt vonSo erhalten Sie den Wert in select in vue.js (ausführliches Tutorial). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn