2019年10月15日
水平居中显示CSS
摘要： HTML代码部分 <div class="center" > <img style="margin:0 auto ;" :src=item.imgThumb> </div> CSS代码部分 .center{ /*水平垂直居中*/ width:100%; height:280px; margin:0 阅读全文
posted @ 2019-10-15 15:04 搜戴斯 阅读(180) 评论(0) 推荐(0) 编辑
VUE 鼠标右键自定义
摘要： 需要在区域内右击自定义菜单的DIV绑定contextmenu右击事件 <div style="width:100% ; z-index: inherit;position: relative;margin:0 auto ;" align="center" @contextmenu.prevent=" 阅读全文
posted @ 2019-10-15 15:04 搜戴斯 阅读(6521) 评论(0) 推荐(0) 编辑
VUE父子组件相互传值
摘要： passer.vue中代码 首先在文件中引入组件 import canvasDraw from '@/components/CanvasDraw/canvasDraw' 局部注册组件：components: { canvasDraw }, HTML中使用组件 <canvas-Draw :imgSrc 阅读全文
posted @ 2019-10-15 15:04 搜戴斯 阅读(193) 评论(0) 推荐(0) 编辑
2019年9月18日
时间戳与时间格式互换方法
摘要： 方法一 //时间格式 let time = '2019-09-17 17:26:20'; console.log(time); //时间格式转换成中国标准时间 let date = new Date(time); console.log(date); //获取毫秒时间戳减去6分钟后转换成中国标准时间 阅读全文
posted @ 2019-09-18 18:03 搜戴斯 阅读(674) 评论(0) 推荐(0) 编辑
2019年9月17日
vue下canvas绘制矩形
摘要： 起因：根据项目需求本人写了一个绘制矩形的组件。功能：在图片中绘制矩形，根据图片大小进行自适应展示，获取图片矩形坐标。思路：首先定义一个固定大小的DIV，DIV标签中有监测鼠标变化的四个事件mousedown，mousemove，mouseup，mouseleave。 第二在DIV标签内有img，ca 阅读全文
posted @ 2019-09-17 15:51 搜戴斯 阅读(6225) 评论(39) 推荐(0) 编辑
2019年9月5日
Pako.js压缩解压,vue压缩解压,前后端之间高效数据传输
摘要： 项目开发中常常会遇到前后端之间有大量数据传输占用带宽导致页面响应慢的问题，这时候我们可以考虑使用Pako.js对信息进行压缩之后传输。 我在前端使用的是vue-element-admin前端框架。框架中有Pako.js包所以直接使用就行。 第一步引入Pako import pako from 'pa 阅读全文
posted @ 2019-09-05 17:20 搜戴斯 阅读(3797) 评论(0) 推荐(0) 编辑
2019年9月2日
vue cavnas绘制矩形，并解决由clearRec带来的闪屏问题
摘要： 起因：在cavnas绘制矩形时 鼠标移动一直在监测中，所以鼠标移动的轨迹会留下一个个的矩形框， 要想清除矩形框官方给出了ctx.clearRect() 但是这样是把整个画布给清空了，因此需要不断 向画布展示新的图片，这样就出现了不断闪屏的问题。 那么怎么解决呢？ microsoft 提供了双缓冲图形 阅读全文
posted @ 2019-09-02 11:57 搜戴斯 阅读(504) 评论(0) 推荐(0) 编辑
2019年8月28日
高效获取图片宽高的轮子
摘要： 我们知道有些图片虽然没有完全加载出来，但是已经先有占位符，然后一点一点的加载。既然有占位符那应该是请求图片资源服务器响应后返回的可服务器什么时候响应并返回宽高的数据并没有触发事件,所以就有了定时检测获取宽高的方法，这种方法比img.onload方法要快，代码如下：// 创建对象 var img = 阅读全文
posted @ 2019-08-28 15:14 搜戴斯 阅读(198) 评论(0) 推荐(0) 编辑
2019年8月13日
vue修改当前页样式不影响公共样式的方法
摘要： 在项目开发中需要对一些标签进行样式修改但是每次修改之后其他页面的样式也会跟着改变， 在网上找了很多方法都不好使后来大神告诉我一种方法很好用分享给大家。 1：首先在template标签下的第一个div中定义一个以本文件为名的class，只要class唯一就行。 2：在style标签添加lang="sc 阅读全文
posted @ 2019-08-13 11:33 搜戴斯 阅读(4462) 评论(0) 推荐(0) 编辑
vue-element-admin 引入高德地图并做海量点标记
摘要： 第一步： 首先在index.html入口文件中添加引入高德地图的js，并填写自己在官网申请的key。如果没有申请不填写也是可以的。 第二步： 在需要的页面map.vue页面加入div并设置div的id 宽高一定要有，地图在页面呈现是canvas做图所以需要设定宽高。 <div id="contain 阅读全文
posted @ 2019-08-13 11:13 搜戴斯 阅读(5487) 评论(0) 推荐(0) 编辑