From cc50224d90b3a71b8cbab892faaa4ff82f0d9399 Mon Sep 17 00:00:00 2001 From: RuoYi <yzz_ivy@163.com> Date: 星期三, 14 四月 2021 11:01:16 +0800 Subject: [PATCH] 固定顶部导航栏&窗口大小改变实时更新栏数 --- ruoyi-ui/src/components/TopNav/index.vue | 19 +++++++++---------- 1 files changed, 9 insertions(+), 10 deletions(-) diff --git a/ruoyi-ui/src/components/TopNav/index.vue b/ruoyi-ui/src/components/TopNav/index.vue index 2397628..3eebda4 100644 --- a/ruoyi-ui/src/components/TopNav/index.vue +++ b/ruoyi-ui/src/components/TopNav/index.vue @@ -47,7 +47,7 @@ topMenus() { let topMenus = []; this.routers.map((menu) => { - if (menu.hidden === false) { + if (menu.hidden !== true) { topMenus.push(menu); } }); @@ -95,21 +95,20 @@ return activePath; }, }, + beforeMount() { + window.addEventListener('resize', this.setVisibleNumber) + }, + beforeDestroy() { + window.removeEventListener('resize', this.setVisibleNumber) + }, mounted() { this.setVisibleNumber(); }, methods: { // 根据宽度计算设置显示栏数 setVisibleNumber() { - const width = document.body.getBoundingClientRect().width - 380; - const elWidth = this.$el.getBoundingClientRect().width; - const menuItemNodes = this.$el.children; - const menuWidth = Array.from(menuItemNodes).map( - (i) => i.getBoundingClientRect().width - ); - this.visibleNumber = ( - parseInt(width - elWidth) / parseInt(menuWidth) - ).toFixed(0); + const width = document.body.getBoundingClientRect().width / 3; + this.visibleNumber = parseInt(width / 85); }, // 菜单选择事件 handleSelect(key, keyPath) { -- Gitblit v1.9.2