logo
publist
写文章

简介

该用户还未填写简介

擅长的技术栈

可提供的服务

暂无可提供的服务

element-ui Select选择器边框闪烁问题 及 :focus-within伪类

背景在提分加项目中用到了element-ui的select组件,发现第一次进入页面点击选择器时会有一个边框闪烁,后审查元素时发现了:focus-within的伪类。解决.select-box span:focus-within {border: none;outline: none;}其中,.select-box是我给select组件取的类名,添加完以上样式后,边...

Vue上传Excel文件并校验Excel内容

背景在近期开发的学校管理系统中,有一个导入管理模块,其中包含Excel的上传功能,由用户选择文件后进行上传,前端需要对文件内容进行初步校验后给出是否符合规范的提示后再传给后端。这就需要前端事先对Excel文件内容进行读取。解决我们这个项目使用Vue+Typescript进行开发,UI库使用的是iView。在简单调研之后,我发现可以使用xlsx库实现对Excel文件内容的读取。下边放实现功能...

vue中v-if和v-show对echarts图的影响

背景前几日在做UBA项目的时候有一个页面需要用echarts图展示用户对各个节目的点播量,页面结构为左侧柱状图展示节目点播量,右侧饼图和折线图展示某个节目的用户点播分布和用户点播变化趋势(如下图),因为我们造的数据是11月26日的,而进入页面默认查询最近1天的,所以刚进来肯定是查不到数据,需要自行选择时间去查询数据。而在查数据的时候出现了echarts折线图无法正确获取宽高的情况。...

#javascript
Vue中监听滚动事件

背景最近在做提分加的预览页面时,有一个用于实现锚点定位的侧边栏导航,而在页面滚动时,侧边导航也需要随着页面的滚动而激活相应的模块,这就需要监听页面的滚动事件了。解决监听滚动事件mounted() {//监听页面滚动事件window.addEventListener('scroll', this.appScroll)//注意:如果由于自己的vue中的样式导致监听不到,可以...

ES6扩展运算符(...)

在使用vuex的过程中,经常会碰到以下写法:...mapGetters('user',['classList','class','subjectList','termList'])在不了解ES6的扩展运算符前,对这种写法很迷惑,不懂...的作用到底是什么,于是通过《ECMAScript 6 入门》一书,学习了扩展运算符的相关知识。数组的扩展运算符概念扩展运算符(spr...

vue路由事件beforeRouteLeave及组件内定时器的清除

背景之前在做ADTS项目的时候,首页是一个实时监测的页面,需要每隔5秒更新一次数据,而业务逻辑上的需要先请求告警列表的接口的,从告警列表中拿到数据再去获取其他的数据,所以我在获取告警列表的方法中增加了一个定时器。最开始我是将定时器声明在组件内部的(由于页面不多,数据关联也不太强,所以项目中没有使用store进行数据管理),后来清除的时候发现无法清除,后来索性声明到window下了。...

Vue中在新窗口打开页面 及 Vue-router

背景在开发提分加项目的过程中,遇到了点击下拉菜单时在新窗口中打开页面,由于之前一直做的是单页面应用,没有碰到过类似的需求,于是上网搜了一下解决办法,也再次系统地温习了一下vue-router。解决使用路由对象的resolve方法解析路由,可以得到location、router、href等目标路由的信息。得到href就可以使用window.open开新窗口了。const ...

Vue项目中实现锚点定位

背景今天在开发限时练-提分加项目的时候,有一个需要锚点定位的需求,而在Vue项目中,使用传统的在a标签的href属性中写id的方法无效,会导致浏览器的地址改变从而跳转到其他页面。解决最终参考vue2.0中怎么做锚点定位改问题下的回答实现了效果。<template><div class="score-preview-container"&

git-flow 的工作流程

原文档:git-flow 的工作流程什么是 git-flow?一旦安装安装 git-flow,你将会拥有一些扩展命令。这些命令会在一个预定义的顺序下自动执行多个操作。是的,这就是我们的工作流程!git-flow 并不是要替代 Git,它仅仅是非常聪明有效地把标准的 Git 命令用脚本组合了起来。严格来讲,你并不需要安装什么特别的东西就可以使用 git-flow 工作流程。你只需要了解,...

Vue中监听键盘事件

背景在一些搜索框中,我们往往需要监听键盘的按下(onkeydown)或抬起(onkeyup)事件以进行一些操作。在原生js或者jQuery中,我们需要判断e.keyCode的值来获取用户所按的键。这样就存在一个问题:我们必须知道某个按键的keyCode值才能完成匹配,使用起来十分不便。keyCode实际键值48到570到965到90a到z(...

到底了