【兼容性】IE10中使用vue.js出現event或event.target未定義問題。


問題描述

  • 在html界面用 v-on:xx 的方式去綁定一個事件函數時IE10 控制台報錯 “valid未定義
  • 問題代碼示例:
<input type="text" v-on:click="valid"/>
<!-- JS 部分-->
<script>
var app = new Vue({
el:"省略",
data:{},
methods:{
	valid:function(event){
		console.log(event.target.tagName);
	}
}
});
</script>
  • 解決過程1:
    我將html中的v-on:click="valid"改為了v-bind:click="valid();"。然后控制台出現了新的錯誤,但是至少確信了 在IE中不支持函數省略括號的寫法。
    新的錯誤是 event.target未定義,於是進入下步解決過程。
  • 解決過程2:
    將html中的v-on:click="valid();"改為了v-on:click="valid($event);"。在事件被觸發后會向 valid(event) 函數傳遞vue中定義的 $event 實例對象,問題得以解決。

修改之后的代碼

<input type="text" v-on:click="valid($event);"/>
<!-- JS 部分-->
<script>
var app = new Vue({
el:"省略",
data:{},
methods:{
	valid:function(event){
		console.log(event.target.tagName);
	}
}
});
</script>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM