今天在使用iview的下拉框的時候，需要獲取下拉框上一次選中的內容，翻了下官方的文檔的下拉選擇內容改變的事件，發現它並沒有提供這個參數。
如下：
返回值就是這一次選擇的內容。並沒有我需要的下拉框改變前的內容。
本來是想加一個變量存儲上次選擇的內容，但是總感覺每次都要修改，太麻煩了。
想了想，官方可能有用上次選擇的內容，只是沒有暴露給使用者。扒了扒官方的數據結構，果然發現了有個字段會保存上次選擇的數據（不過需要注意的是，這個數據在觸發on-change事件的時候，才是改變前的數據，如果on-change事件結束，依然會被iview修改為這次選中的數據），代碼如下：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>iview example</title> <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <link rel="stylesheet" type="text/css" href="http://unpkg.com/iview/dist/styles/iview.css"> <script type="text/javascript" src="http://vuejs.org/js/vue.min.js"></script> <script type="text/javascript" src="http://unpkg.com/iview/dist/iview.min.js"></script> </head> <body> <div id="app"> <i-select ref="test" v-model="model1" style="width:200px" @on-change="mytest"> <i-option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</i-option> </i-select> </div> <script> window.vm = new Vue({ el: '#app', data: { cityList: [ { value: 'New York', label: '紐約' }, { value: 'London', label: '倫敦' }, { value: 'Sydney', label: '悉尼' }, { value: 'Ottawa', label: '渥太華' }, { value: 'Paris', label: '巴黎' }, { value: 'Canberra', label: '堪培拉' } ], model1: '' }, methods: { mytest: function (val) { console.log("本次選擇的內容"+val); //注意：需要給select標簽設置ref，通過ref去獲取數據 console.log("上一次選擇的內容"+vm.$refs.test.value); //如果想要獲取輸入框的內容，可能需要去遍歷list了，根據value取label $(this.cityList).each(function(index,obj){ if(obj.value === vm.$refs.test.value){ console.log("上一次選擇的輸入框內容"+obj.label); } }) } } }) </script> </body> </html>