首页 > 其他分享 >el-menu sidebar是否隐藏

el-menu sidebar是否隐藏

时间:2023-09-27 11:38:20浏览次数:34  
标签:el menu app dispatch sidebar isMobile

vue-element-admin   (git)

 

窗口宽度变化,菜单自动隐藏

  beforeMount() {
    window.addEventListener('resize', this.$_resizeHandler)
  },
 $_resizeHandler() {
      console.log('窗框宽度变化,这里执行了, window.addEventListener的使用')
      if (!document.hidden) {
        const isMobile = this.$_isMobile()
        store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop')

        if (isMobile) {
          store.dispatch('app/closeSideBar', { withoutAnimation: true })
        }
      }
    }

 

标签:el,menu,app,dispatch,sidebar,isMobile
From: https://www.cnblogs.com/dianzan/p/17732258.html

相关文章

  • element ui踩坑
    项目适配需要rem转换,但UI组件内部未转换问题:由于组件内,某些组件宽度和高度是通过prop传参,然后对行内样式动态赋值,所以单位还是px网上找的方法:将elementui的github源码拉下来,然后修改组件源码,然后打包,然后打补丁替换lib文件夹。个人觉得太繁琐,问题在于,所有的组件都得适配,......
  • Selenium进阶——解决web 自动化中上传文件的问题
    在做ui自动化测试中,经常会遇到上传文件或者图片的场景,通常的解决方案是自动化工具+autoIT,在这里我介绍一种通过jdk自带api——java.awt.Robot来解决类似问题的方法。java.awt.Robot类主要用于模拟用户点击键盘上的按键,或者模拟用户敲击鼠标等动作。在做web测试时,弹出窗口如下图所......
  • 使用EasyExcel 导入数据,失败原因数据导出
    引言在日常开发过程中,Excel导入是非常常见的场景,而且也有很多开源的项目是针对Excel的读写的,如Apache的poi,最近用的比较好的还是阿里的EasyExcel开源工具。平时我们只是简单的读取文件并写入数据库持久化即可,但是前段时间,产品搞了个需求,需要将导入失败的数据及原因写入Excel......
  • Node.js vs. Spring Boot:Hello World 性能对决,谁更快一点?
    前言:SpringBoot在Java生态中备受欢迎,它是一款基于Java构建的轻量级服务端框架,主要用于Web服务。SpringBoot的应用使得创建各类基于Spring的企业级应用变得异常简单。Node.js作为一种基于ChromeV8引擎的JavaScript运行时环境,在服务端上运行JavaScript代码。它以其独......
  • 微服务测试的关键——通过ELK查询日志
    为什么需要ELK一般我们在工作中查询日志搜索问题时,通常需要直接在日志文件中进行grep、awk操作就可以获得自己想要的信息。但在规模较大的场景中,此方法效率低下,面临问题包括日志量太大如何归档、文本搜索太慢怎么办、如何多维度查询。随着微服务的广泛应用,无论系统日志,还是业务日......
  • Node.js vs. Spring Boot:Hello World 性能对决,谁更快一点?
    前言:SpringBoot在Java生态中备受欢迎,它是一款基于Java构建的轻量级服务端框架,主要用于Web服务。SpringBoot的应用使得创建各类基于Spring的企业级应用变得异常简单。Node.js作为一种基于ChromeV8引擎的JavaScript运行时环境,在服务端上运行JavaScript代码。它以其独特......
  • element-ui plus 修改对话框的样式,无效
    <el-dialogv-model="dialogVisible"title="Tips"width="30%":before-close="handleClose"append-to-body><span>Thisisamessage</span><template#footer>......
  • 干货!Playwright架构与Selenium 架构对比
    在Web测试自动化方面,Selenium多年来一直是行业的主导工具。但是,市场上还有许多其他自动化测试工具。Playwright是一种较新的工具,已经越来越受欢迎。网上有很多文章对二者进行对比,今天我从二者的架构角度进行一下对比分析!关于二者在其他方面的区别,我会在后面的文章中持续更新,......
  • 上手ElasticSearch必须了解的核心概念
    ElasticSearch概述ElasticSearch(简称ES)是一个分布式的使用REST接口的搜索引擎,属于非关系型数据库。它是在lucene的基础上进行研发的,隐藏了lucene的复杂性,提供简单易用的RESTfulApi接口。ES的分片相当于lucene的索引。ES属于Elastic公司,该公司同时拥有Logstash及......
  • 干货!一文搞定无头浏览器的概念以及在selenium中的应用
     无头浏览器无头浏览器,即HeadlessBrowser,是一种没有界面的浏览器。它拥有完整的浏览器内核,包括JavaScript解析引擎、渲染引擎等。与普通浏览器最大的不同是,无头浏览器执行过程中看不到运行的界面,但是我们依然可以用GUI测试框架的截图功能截取它执行中的页面。在这里强调一下......