h5网站建站,青海西宁最新消息今天,长沙市互联网加网站,wordpress中文社区背景
如果我们要阻止默认事件#xff0c;在 chrome 等浏览器中#xff0c;我们可能要写一个#xff1a;
event.preventDefault();
而在 IE 中#xff0c;我们则需要写#xff1a;
event.returnValue false;
jquery #xff0c;跨浏览器的实现#xff0c;我们统一只…背景
如果我们要阻止默认事件在 chrome 等浏览器中我们可能要写一个
event.preventDefault();
而在 IE 中我们则需要写
event.returnValue false;
jquery 跨浏览器的实现我们统一只需要写
event.preventDefault();
vue 中的 event 对象
相比于 jqueryvue 的事件绑定可以显得更加直观和便捷我们只需要在模板上添加一个 v-on 指令还可以简写为 即可完成类似于 $(xxx).bind 的效果少了一个利用选择器查询元素的操作。我们知道jquery 中event 对象会被默认当做实参传入到处理函数中如下
$(body).bind(click, function (event) {console.log(typeof event); // object
});
这里直接就获取到了 event 对象那么问题来了vue 中呢
div idappbutton v-on:clickclickclick me/button
/div
...
var app new Vue({el: #app,methods: {click(event) {console.log(typeof event); // object}}
});
原来vue.js通过将一个特殊变量 $event 传入到回调中解决这个问题
简单总结其用法 使用不带圆括号的形式event 对象将被自动当做实参传入 使用带圆括号的形式我们需要使用 $event 变量显式传入 event 对象。
乌龙
类似下面的代码
div idappbutton v-on:clickclick(233)click me/button
/div
...
var app new Vue({el: #app,methods: {click(val) {console.log(typeof event); // object}}
}); 丢进 chrome 里面一跑经测试是可以的打印 arguments.length也是正常的 1 既没有传入实参也没有接收的形参这个 event 对象的来源window.event window.eventie 和 chrome 都在 window 对象上有这样一个属性 window.event
代码丢进 Firefox 中运行event 果然就变成了 undefined 了。