自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(20)
  • 收藏
  • 关注

原创 重写element的message解决弹框多次问题,始终弹最后一次

第一步:创建message.js的js文件/*重写element-ui $message 解决消息多次弹出的问题 最新的会覆盖之前的/import {Message} from “element-ui”;let messageInstance = null;const overrideMessage = (options) => {if (messageInstance) {messageInstance.close();}messageInstance = Message(o

2020-11-18 14:45:09 541

原创 vue获取元素距离顶部的距离,结合jq实现元素瞄点平滑移动

//页面滚动 goThrough(item) { var offsetTop; switch (item) { case 0: offsetTop = this.$refs.offsetBox1.getBoundingClientRect().top console.log(off...

2020-09-14 20:26:15 376

原创 倒计时代码

//加载页面调用const _this = thissetInterval(function () {console.log(_this.showTime())}, 1000); //反复执行函数本身//倒计时方法showTime() {var nowtime = new Date(), //获取当前时间endtime = new Date(“2020/12/12”); //定义结束时间var time = endtime.getTime() - nowtime.getTime()

2020-09-10 15:51:23 321

原创 css实现导航下划线鼠标跟随效果

不可思议的CSS 导航栏 光标下划线跟随 PURE CSS Coco <style> ul { display: flex; position: absolute; width: 800px; top: 50%; left: 50%; tra...

2020-08-26 10:10:04 353

转载 移动端种树活动方法

//计算两个时间相差的天数//今天的时间var day = new Date();day.setTime(day.getTime());var s2 = day.getFullYear() + “-” + (day.getMonth() + 1) + “-” + day.getDate();console.log(s2)this.endTime = this.dateDiff(s2, ‘2020-10-24’)//两个时间相差天数dateDiff(firstDate, secondDate)

2020-08-22 15:27:31 267

原创 element-ui的树型控件自定义图标的使用

<el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" node-key="id" > <span class="custom-tree-node" slot-scope="{ node, data }" > <span.

2020-07-28 13:58:30 544

原创 树型菜单数据的处理

//处理树型数据递归实现 var data = [ { id: 1, name: "办公管理", pid: 0 }, { id: 2, name: "请假申请", pid: 1 }, { id: 3, name: "出差申请", pid: 1 }, { id: 4, name: "请假记录", pid: 2 }, { id: 5, name: "系统设置", pid: 0 }, { id: 6, name:

2020-07-28 13:33:59 249

原创 vue使用vuedraggable实现拖拽排序布局

import draggable from “vuedraggable”;<!-- 拖拽 --> <div class="content"> <draggable v-model="shopList" @update="datadragEnd" :options="{animation:500}"> <transition-group class="clearfix"> <div

2020-07-21 18:39:48 2093 1

原创 谷歌浏览器跨域设置,不使用CORS插件

1.在电脑上新建一个目录,例如:C:\MyChromeDevUserData2.在属性页面中的目标输入框里加上 --disable-web-security --user-data-dir=C:\MyChromeDevUserData,–user-data-dir的值就是刚才新建的目录。3.点击应用和确定后关闭属性页面,并打开chrome浏览器。再次打开chrome,发现有“–disable-web-security”相关的提示,说明chrome又能正常跨域工作了。...

2020-07-21 18:07:17 1123

原创 element实现自定义table列表,复选框控制生成头部动态渲染数据

其实很简单 不需要担心数据如何渲染,element会自动根据你的选中对象的label和prop去渲染后台数据,只需要你把你的prop和后台的prop写成一致的就行。自己理解哈,很简单。html部分<div class="clearfix"> <div class="pull-left"> <el-popover placement="right"

2020-07-14 16:58:00 809

原创 css设置文本,元素超出盒子自动换行,并且超出盒子范围出现滚动条,自定义滚动条的样式

//设置文本自动换行,行内元素数字字母需要设置,块级标签一般会超出自动换行。div { word-wrap: break-word; //设置文本自动换行 word-break: normal;}//超出盒子设置滚动条,并且自定义滚动条样式,以下滚动条样式最好都设置。div { height: 400px; overflow: auto; /*当内容超过,出现滚动条*/}//设置滚动条样式div ::-webkit-scrollbar { /*滚动条整体*/ wi

2020-07-12 12:01:41 4655 1

原创 vue全局配置防抖和节流

函数防抖定义:多次触发事件后,事件处理函数只执行一次,并且是在触发操作结束时执行。在vue中对click添加防抖处理:const on = Vue.prototype.$on// 防抖处理Vue.prototype.$on = function (event, func) { let timer let newFunc = func if (event === 'click') { newFunc = function () { clearTimeout(timer

2020-07-10 15:47:10 2064 1

原创 js获取当前时间并处理为YY-MM-DD格式,利用moment.js插件处理时间

获取当前时间并且转成YY-MM-DD格式://获取当前日期 getNowFormatDate() { var date = new Date(); var seperator1 = "-"; var year = date.getFullYear(); var month = date.getMonth() + 1; var strDate = date.getDate(); if (month >= 1 &&amp

2020-06-22 16:14:27 954

原创 vue使用xlsx实现上传excel表格并读取到表格数据

转载大佬的博客,原文请看:https://blog.csdn.net/qq_39009348/article/details/84613577今天我们来详细讲解怎样使用xlsx实现前端上传excel表格并读取表格数据。首先,我们安装xlsx:npm install xlsx --save然后,我们再使用xlsx,封装一个读取excel表格数据的组件:<template> <span style="margin-right:10px"> <input clas

2020-06-19 10:25:28 2446

原创 vue使用qrcodejs2实现生成二维码

npm install qrcodejs2 --save 下载插件依赖代码部分:

2020-06-19 09:36:41 354

原创 echarts的适配问题

myChart.setOption(option);window.onresize = function () {myChart.resize();//myChart1.resize(); //若有多个图表变动,可多写}如果多个表格不触发,可以监听一下:window.addEventListener(“resize”, () => {this.myChart.resize();this.myChart2.resize();this.myChart3.resize();this

2020-06-18 17:46:25 1122

原创 vue实现自定义分页功能组件,不是element自带ui,实现组件复用

分页组件: 共 {{tableData.length}} 条 父组件: 积分来源分析

2020-06-18 15:52:01 424

原创 css伪类实现鼠标移入元素显示提示消息,不是element的自带提示功能

此乃小弟亲测,希望对各位大佬有用。html部分: <!-- <a href="javascript: void(0)" data-tooltip="撒大声地所 &nbsp; 奥术大师多所" ><i class="iconfont">与官方积分打通 &#xe3432;</i></a>-->css部分使用的是scss预处理器:// 鼠标悬停提示a {text-decoration

2020-06-17 15:07:22 1000 1

原创 vue实现点击按钮,保存Echarts图片到本地,不是Echarts自带的保存功能

//点击保存下载图片downloadFile() {let aLink = document.createElement(‘a’);let blob = this.base64ToBlob();let evt = document.createEvent(‘HTMLEvents’);evt.initEvent(‘click’, true, true);aLink.download = “积分趋势效果统计图”; //下载图片的名称aLink.href = URL.createObjectURL(

2020-06-17 14:58:19 1169

原创 vue利用file-saver和xlsx实现导出Excel表格到本地

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar

2020-06-17 14:46:15 2148 2

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除