老早就聽說了Vue.js是多么的簡單、易學、好用等等，然而我只是粗略的看了下文檔，簡單的敲了幾個例子，僅此而已。
最近由於項目的需要，系統的看了下文檔，也學到了一些東西。
廢話不多說，這里要說的是下拉列表以及選中某一選項觸發選中事件。
1、下拉列表
（1）、html部分代碼：
<div id="app">
<select v-model="selected"> <option>--請選擇--</option> <option v-for="item in optList">{{ item }}</option> </select>
</div>
（2）、js部分代碼：
new Vue({
el: '#app',
data: {
selected: '',
optList: ['青龍', '白虎', '朱雀', '玄武']
}
})
結果就是這樣：
（2）、選中選項觸發事件
這種情況下，可以使用change事件，當選中某一選項后，便會觸發該事件。完整代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://cdn.bootcss.com/vue/2.5.13/vue.min.js"></script>
</head>
<body>
<div id="app">
<select name="" id="" v-model="select2" @change='getValue'>
<option value="">--請選擇--</option>
<option v-for='item in optionList'>{{ item }}</option>
</select>
</div>
<script>
new Vue({
el: '#app',
data: {
select2: '',
optionList: ['青龍', '白虎', '朱雀', '玄武']
},
methods: {
getValue: function(){
console.log('您選擇了', this.select2)
}
}
})
</script>
</body>
</html>