在最外层标签添加 :@wheel 鼠标滚动事件

<template :@wheel="closeSelect">

在mounted中挂载 监听鼠标滚动事件的方法

mounted() { window.addEventListener('wheel',this.closeSelect) },

在方法中 让select方法失去焦点 时间组件 收起的方法在源码中 handleClose() 方法 触发关闭 elementui时间组件

closeSelect(){ this.$refs.closeGroupSelect.blur(); this.$refs.closeWorkSelect.blur(); this.$refs.closeCustDeptSelect.blur(); this.$refs.closeBigSelect.blur(); this.$refs.closeTwoBigSelect.blur(); this.$refs.closeTime.handleClose(); }

鼠标滚动监测 在activated -> 相当于created 页面初始化的时候监控

在deactivated -> 相当于beforeDistory 页面跳转的时候进行销毁 要不然会影响到其他页面

(这两个方法用于路由跳转 而不是页面初始以及页面销毁)

activated() { this.periodicRefresh(); window.addEventListener('wheel',this.closeSelect) }, deactivated() { // 页面关闭（路由跳转）时清除定时器 clearInterval(this.queueTableDataTimer); this.queueTableDataTimer = null; // 页面跳转清除 滚动事件 window.removeEventListener('wheel', this.closeSelect) },