我們可以在選擇標記上使用什么事件來觸發更改，還可以在重新選擇相同選項時觸發該事件？

Question

我一直在使用v-on:change來觸發vuejs應用程序中的選項更改。

<select v-on:change="myMethod()">
  <option v-for="(val, key) in options" :value="val">
    {{key}}
  </option>
</select>

但是，每當第二次再次選擇相同的選項時，我還需要觸發該方法。

在這種情況下，不會再次觸發change事件。

我找不到vuejs的事件列表。
這是我為HTML找到的一個： https : //www.w3schools.com/tags/ref_eventattributes.asp

我嘗試了v-on:select ，什么也沒做

編輯：
我的意圖是將選項鏈接到不同的2個值，一個v模型將不足。 第二次單擊，將反轉app。$ data的布爾屬性。 這就是為什么我不使用v模型。

Answer 1

這個問題實際上與Vue無關，這與<select>在選擇， change和input選項時發出的本機事件有關，並且這兩個事件僅在更改了所選選項時才發生，而在選定選項被更改時才發生。重新選擇。

據我所知，沒有辦法檢測到何時重新選擇了相同的選項。 您可能需要滾動自己的具有此功能的控件。

您可能可以通過跟蹤鼠標事件來破解它，但是在每種情況下（例如，不同的瀏覽器和移動設備）可能都無法100％起作用。

Answer 2

您是否想要類似v-on:click類的東西。

 new Vue({ el:"#app", data:{ test:"", options:["11","22"] }, methods:{ myMethod:function(){ if(this.test){ console.log("myMethod called . test is :"+this.test+" at ->", new Date()); } } } }) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="app"> <select v-on:click="myMethod" v-model="test"> <option v-for="(val, key) in options"> {{val}} </option> </select> </div> 

Answer 3

嘗試使用onclick（在選擇項上，而不是選項上），它似乎可以工作，雖然不確定它是否在所有瀏覽器上都有效，但是至少在Webkit瀏覽器中單擊一個選項時會觸發該事件。

https://jsfiddle.net/zdy25mo7/3/

html

<p>Select a new car from the list.</p>

<select id="mySelect">
  <option value="Audi">Audi
  <option value="BMW">BMW
  <option value="Mercedes">Mercedes
  <option value="Volvo">Volvo
</select>

<p id="clicked_div">clicked: 0 times</p>

javascript

var clicked = 1
document.getElementById('mySelect').onclick = function otherFunction(event) {
    document.getElementById("clicked_div").innerHTML = "clicked: " + clicked + " times";
    clicked++;
}