cari

Rumah >hujung hadapan web >tutorial js >在vue.js中如何获取select中的value值（详细教程）

在vue.js中如何获取select中的value值（详细教程）

亚连
亚连asal
2018-06-02 10:17:318260semak imbas

下面我就为大家分享一篇vue.js 获取select中的value实例，具有很好的参考价值，希望对大家有所帮助。

如下所示：

<!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标签属性中插入变量参数的方法（详细教程）

Atas ialah kandungan terperinci 在vue.js中如何获取select中的value值（详细教程）. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：如何使用vue自定义filters过滤器Artikel seterusnya：如何使用JS实现微信红包算法

Artikel berkaitan

Lihat lagi