草庐IT

Min_element

全部标签

【vue后台管理系统】基于Vue+Element-UI+ECharts开发通用管理后台(中)

文章目录Vuex实现左侧菜单栏折叠效果展示思路分析及代码实现漏洞完善Home组件的实现名片部分table数据展示部分订单统计部分实现首页可视化图表样式调整ECharts基本使用折线图柱状图饼状图附:项目中对axios的使用(二次封装)第一次封装第二次封装附:使用Mock.js完成数据模拟Vuex实现左侧菜单栏折叠效果展示点击菜单图标之前:点击菜单图标之后:思路分析及代码实现首先我们要知道菜单栏的收缩,由el-menu的collapse属性控制:我们通过分析可以知道:菜单按钮的点击是在CommonHeader.vue组件中,而我们修改的collapse属性却在CommonAside.vue中,这

【vue后台管理系统】基于Vue+Element-UI+ECharts开发通用管理后台(中)

文章目录Vuex实现左侧菜单栏折叠效果展示思路分析及代码实现漏洞完善Home组件的实现名片部分table数据展示部分订单统计部分实现首页可视化图表样式调整ECharts基本使用折线图柱状图饼状图附:项目中对axios的使用(二次封装)第一次封装第二次封装附:使用Mock.js完成数据模拟Vuex实现左侧菜单栏折叠效果展示点击菜单图标之前:点击菜单图标之后:思路分析及代码实现首先我们要知道菜单栏的收缩,由el-menu的collapse属性控制:我们通过分析可以知道:菜单按钮的点击是在CommonHeader.vue组件中,而我们修改的collapse属性却在CommonAside.vue中,这

解决element-ui动态加载级联选择器默认选中问题(Cascader)

前言最近在开发任务中碰到需要在新增和修改时使用动态加载级联选择器,但是当在修改时设置默认选中项,出现了后端数据返回较慢,导致无法选中和级联框选中了但input框不显示的问题,网上找到的方法也不是很有效,还得使用ref查看组件实例和element-uicascader源码来寻找解决方法。完整的实现代码在最后1.解决方法我们知道使用动态加载的级联选择器需要使用lazyLoad函数,那就先开始寻找lazyLoad函数,使用ref查看组件实例,可以看到是在panel下。再来看看源码,可以发现只需要传入Object数据即可,如:this.$refs.xxx.panel.lazyLoad(val)。知道了

解决element-ui动态加载级联选择器默认选中问题(Cascader)

前言最近在开发任务中碰到需要在新增和修改时使用动态加载级联选择器,但是当在修改时设置默认选中项,出现了后端数据返回较慢,导致无法选中和级联框选中了但input框不显示的问题,网上找到的方法也不是很有效,还得使用ref查看组件实例和element-uicascader源码来寻找解决方法。完整的实现代码在最后1.解决方法我们知道使用动态加载的级联选择器需要使用lazyLoad函数,那就先开始寻找lazyLoad函数,使用ref查看组件实例,可以看到是在panel下。再来看看源码,可以发现只需要传入Object数据即可,如:this.$refs.xxx.panel.lazyLoad(val)。知道了

Element UI - v-infinite-scroll无限滚动组件

一、v-infinite-scroll无限滚动组件使用详解1、v-infinite-scroll="load"//load无限滚动加载的方法2、infinite-scroll-disabled//是否禁用无限滚动加载3、infinite-scroll-delay//节流时延,单位为ms4、infinite-scroll-distance//触发加载的距离阈值,单位为px5、infinite-scroll-immediate//是否立即执行加载方法,以防初始状态下内容无法撑满容器。//默认情况下,infinite-scroll-disabled是false,因此如果组件使用无限滚动加载组件,即使

Element UI - v-infinite-scroll无限滚动组件

一、v-infinite-scroll无限滚动组件使用详解1、v-infinite-scroll="load"//load无限滚动加载的方法2、infinite-scroll-disabled//是否禁用无限滚动加载3、infinite-scroll-delay//节流时延,单位为ms4、infinite-scroll-distance//触发加载的距离阈值,单位为px5、infinite-scroll-immediate//是否立即执行加载方法,以防初始状态下内容无法撑满容器。//默认情况下,infinite-scroll-disabled是false,因此如果组件使用无限滚动加载组件,即使

在vue中实现多个文件下载&&element ui 实现弹窗

目录1在vue中实现多个文件下载1.1window.open1.2iframe方法1.3使用a标签2elementui实现弹窗1在vue中实现多个文件下载后端返回多个URL,前端直接点击下载1.1window.openleturl=“xxx”;window.open(url)在新窗口打开该下载链接,只能打开一个,多个文件下载不支持1.2iframe方法使用iframe方法(此方法浏览器会跳出弹窗,是否允许下载多个文件,用户体验不好)exportconstdownloadFile=(url)=>{constiframe=document.createElement("iframe");ifram

在vue中实现多个文件下载&&element ui 实现弹窗

目录1在vue中实现多个文件下载1.1window.open1.2iframe方法1.3使用a标签2elementui实现弹窗1在vue中实现多个文件下载后端返回多个URL,前端直接点击下载1.1window.openleturl=“xxx”;window.open(url)在新窗口打开该下载链接,只能打开一个,多个文件下载不支持1.2iframe方法使用iframe方法(此方法浏览器会跳出弹窗,是否允许下载多个文件,用户体验不好)exportconstdownloadFile=(url)=>{constiframe=document.createElement("iframe");ifram

python + selenium在有界面模式下正常,在无界面模式下运行报错Message: element not interactable

我有一个文件,在有界面模式下测试运行24小时无报错,但是一旦切换到有界面模式下,运行到特定的click步骤就报错Message:elementnotinteractable。查阅网上各路帖子感觉都没我的疑问:到底是什么原因导致报错Message:elementnotinteractable。实际问题还是在浏览器窗口分辨率上。本以为最大化窗口,窗口会按照目前电脑显示器分辨率最大化,但实际上在无界面模式下打开浏览器并最大化后运行与有界面模式下并不相同一下是在我的电脑上的运行结果,顺带一提,我的显示器是1920*1080分辨率无界面模式:fromseleniumimportwebdriverchro

python + selenium在有界面模式下正常,在无界面模式下运行报错Message: element not interactable

我有一个文件,在有界面模式下测试运行24小时无报错,但是一旦切换到有界面模式下,运行到特定的click步骤就报错Message:elementnotinteractable。查阅网上各路帖子感觉都没我的疑问:到底是什么原因导致报错Message:elementnotinteractable。实际问题还是在浏览器窗口分辨率上。本以为最大化窗口,窗口会按照目前电脑显示器分辨率最大化,但实际上在无界面模式下打开浏览器并最大化后运行与有界面模式下并不相同一下是在我的电脑上的运行结果,顺带一提,我的显示器是1920*1080分辨率无界面模式:fromseleniumimportwebdriverchro