一直对DOM事件(event)模棱两可,今天测试了一下,有些眉目了。
在纯js里,但凡有事件的地方,event是一个关键字,不能用其他代替:
<!DOCTYPE html>
<html>
<script type="text/javascript">
var test = function(a,b,c,d){
console.log(a,b,c,d) // 1 MouseEvent {isTrusted: true, screenX: 65, screenY: 199, clientX: 65, clientY: 79, …} 3 4
}
</script>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div style="width:100px;height:100px;background:#f00" onclick="test(1,event,3,4)">
</div>
</body>
</html>
而在Vue里,event对象做了特殊处理,变成了$event,只能用$event才能获取事件。
<button v-on:click="warn('Form cannot be submitted yet.', $event)">
Submit
</button>
如果写event会报错未定义
[Vue warn]: Property or method "event" is not defined on the instance but referenced during render.