前端性能优化--css 和 js 的装载与执行
说明
要求
- 假定现在有路由/news,/login
- 监听键盘事件,只允许在/news页面内有效
- 不管后面跳到哪个页面,都不会触发对应的键盘事件,只能在/news里才触发
问题
- 没有进入/news之前,按键盘上的键,不会触发事件,
- 进过/news后,不管有没有按键盘上的键,再跳到别的页面,按键盘上的键,都会触发事件
代码
srcviewsnews.vue<template> <div> news </div> </template> <script> export default { data() { return { flag: true, //底部图片列表显示隐藏 name: "aa" }; }, methods: { keyLeft() { alert(this.name); }, keyUp() { alert("向上方向键"); }, keyRight() { alert("向右方向键"); }, keyDown() { alert("向下方向键"); }, keys() { var that = this; document.onkeydown = function(e) { let key = window.event.keyCode; if (key == 37) { that.keyLeft(); } else if (key == 38) { that.keyUp(); return false; //有上下滚动条的时候,不向上滚动 } else if (key == 39) { that.keyRight(); } else if (key == 40) { that.keyDown(); return false; //有上下滚动条的时候,不向上滚动 } }; } }, created() { if (this.flag == true && this.$route.path == "/news") { this.keys(); } }, mounted() {} }; </script>
相关推荐
qiupu 2020-11-04
多读书读好书 2020-11-03
RedCode 2020-10-28
jiedinghui 2020-10-25
Ladyseven 2020-10-22
hellowzm 2020-10-12
zuncle 2020-09-28
Ladyseven 2020-09-11
jiedinghui 2020-09-07
xiaohuli 2020-09-02
葉無聞 2020-09-01
impress 2020-08-26
ThikHome 2020-08-24
nicepainkiller 2020-08-20
hellowzm 2020-08-18