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