- 博客(51)
- 收藏
- 关注
RSS订阅原创 input框的ocr识别以及复制粘贴功能
<div class="inputBox" @touchstart="touchin()" @touchend="clickhandle()" @click="onlyClick"> <input type="text"> <div class="pasteBox" v-if="Loop==0" @click="pasteClick()">粘贴</div> <div class="slot-dialog-content"
2022-02-16 10:11:32
765
原创 ie与谷歌不兼容的样式问题（hack）
碰到了一个ie与谷歌不兼容的问题出现原因：由于写了百分比，在谷歌跟ie里的显示样式误差较大两者不可兼得所以最后的解决思路是：给其中一方添加hack，eg：谷歌@media screen and (-webkit-min-device-pixel-ratio:0) { .container .header .mainBox .login { margin: 3% 5% 0 4%; }}...
2021-08-26 22:12:21
1087
2
原创 vant-el-tooltip的bug修复（在火狐浏览器72、51鼠标移入不停抖动）
使用方法：<el-tooltip class="item" effect="dark" placement="bottom-start" v-model="tooltip1"> <div slot="content">服务引导，点击该功能可进入当前服</br>务的操作引导模式,提示功能的主要</br>操作步骤或重点关注事项。</div> <img class="header-icon tool
2021-08-26 22:08:10
740
原创 假分页--js
移动端：//上拉加载let a = [1,2,3,2,3,4,4,3,3,3,3,3,3,3,2,2,33,34,3,4];let b = [];function fn(){ if(a.length>10){ b = b.concat(a.splice(0,10)); }else{ b = b.concat(a); a = [] } console.log(b
2021-08-02 21:26:35
211
原创 vue--页面缓存
很多时候，为了让提高用户的体验感，在页面上添加缓存，是十分有必要的，本文转载自：https://www.cnblogs.com/smart-girl/p/10496769.html通过组件<keep-alive></keep-alive>来进行页面数据的缓存<keep-alive> <router-view></router-view></keep-alive>//可以通过路由中的参数来判断是否给页面添加缓存<
2021-05-23 20:45:12
196
原创 element-ui的el-date-picker组件的关联限制使用方法
限制日期组件不能选择，可以使用提供的pickerOptions属性来进行操作case1：如果想要单纯的限制一个日期组件的可选日期（比如截止到当前日期之后的不能选择）<div class="block"> <span class="demonstration">默认</span> <el-date-picker v-model="value1" type="date" @change="selectPicker"
2021-05-23 20:23:37
755
原创 npm ERR! code ETIMEDOUT npm ERR! errno ETIMEDOUT npm ERR! network request to https://registry.npmjs.
问题：使用npm 下载nrm 时报错解决：npm cache clean -f清理缓存npm install -g cnpm 安装cnpm然后再进行安装npm install nrm -g使用nrm查看镜像时报错nrm ls找到这个js文件找到这一行，并且屏蔽，替换为const NRMRC = path.join(process.env[(process.platform == 'win32') ? 'USERPROFILE' : 'HOME'], '.nrmrc');再使用n
2021-04-13 10:57:08
3536
2
原创 字节跳动--面试
自我介绍bfc同步异步promise判断数据类型array用什么判断用promise实现promise.all遍历对象css3的动画效果http缓存 协商缓存
2021-03-31 17:44:17
89
原创 亲身经历——前端面试
1.css3新特性：border-radius：为元素添加圆角边框box-shadow：向框添加一个或多个阴影border-image：设置边框图像background-size：背景图片的尺寸linear-gradient()：线性渐变word-break：定义如何换行word-wrap：允许长的内容可以自动换行transform：应用于元素的2D或3D转换transition：设置元素当过渡效果animation：为元素添加动画2.雪碧图（精灵图）优点减少图片的字节；减少了
2021-03-30 20:06:03
257
原创 条码打印以及二维码打印
条码打印function setFlowCardCodeHtml(rows, order){ if(!isEmpty(rows) && rows.length>0){ //debugger; jQuery(rows).each(function(index,row){ if(!isEmpty(row.NId)){ //领料单号 .
2021-03-23 14:53:17
111
原创 lodop多页-打印-分组
//打印预览 printPreview:function() { // console.log(this.grid.data); var LODOP; LODOP = getCLodop(); this.CreateOneFormPage(); LODOP.PREVIEW(); }, //分组（区分，每页，展示不同的类型下的所有数据） groupBy:function(list, fn){ .
2021-03-23 14:48:00
831
原创 获取对象的key&value值（+index索引）
获取key&value的值，使用for in方法：方案一：for invar count = 0;var obj = {id:1,name:2};for (var i in obj ) { count ++; console.log(i);//输出：id,name console.log(obj[i]);//输出：1,2}但是有时候想要用for in的同时获取对象的索引，这个时候可以添加变量的方式来获取索引，也可以使用以下方案:方案二：Object.getOwnPrope
2021-01-29 11:18:47
4458
原创 上传文件太大（分片）--js
AjaxFile(file, i,timestamp){ let me = this; var name = file.name, //文件名 size = file.size, //总大小shardSize = 2 * 1024 * 1024, shardSize = 1 * 1024 * 1024,//以2MB为一个分片 shar
2021-01-26 16:53:46
197
原创 无缝轮播图（也可实现公告栏）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{ mar
2021-01-20 17:22:46
249
3
原创 类似轮播循环的工位--js
实现效果：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #box{
2021-01-20 17:20:54
104
1
原创 原生小程序报错：previewImage:fail parameter error: parameter.urls[0] should be String instead of Object；
翻译：参数错误:参数。url[0]应该是字符串而不是对象;也就是说url[0]的表现形式应该是["../../images/banner1.jpg","../../images/banner2.jpg"]如果单纯的传入数组过去的话数组对象的方式传过去，所以就会出错：所以此时需要将数组的参数img转换成字符串方案1bindPreview(event){ let currentUrl = event.currentTarget.dataset.index; console.log
2020-12-04 14:15:23
9828
3
原创 原生小程序--支付
<view class="order_pay_wrap" bindtap="handleOrderPay" > 支付({{totalNum}}) </view>// 点击 支付 async handleOrderPay() { try { // 1 判断缓存中有没有token const token = wx.getStorageSync("token"); // 2 判断 if (!toke
2020-12-04 10:07:44
259
原创 原生小程序--授权
**获取授权——getUserInfo**<button type="primary" plain open-type="getUserInfo" bindgetuserinfo="handleGetUserInfo" > 获取授权</button>// 获取用户信息包含获取token等业务逻辑 async handleGetUserInfo(e) { try { // 1 获取用户信息 const { encryptedDa
2020-12-04 09:44:09
243
原创 js获取当前日期的周一和周天
<script type="text/javascript"> function formatDate(date) { var myyear = date.getFullYear(); var mymonth = date.getMonth() + 1; var myweekday = date.getDate(); if (mymonth < 10) { mymonth = "0" + mymonth; }
2020-11-23 15:42:36
1409
原创 Js处理数组json属性
var data1=[ { appName: '1', key: 233456 }, { appName: '2', key: 124535 } ] 想要实现将data1里的appName替换方案一：var data = data1; console.log(data) for(var i = 0;i<data.length;i++){ if(data[i].appName === '1'){
2020-10-22 18:36:11
183
原创 判断两个数组里对象是否相同
需求：想要实现判断以下两个数组是否相同，进行想要实现的操作var data1 = [ {id:1,Name:'11'}, {id:2,Name:'22'}, {id:3,Name:'33'}, {id:4,Name:'44'} ] var data2 = [ {id:1,Name:'11'}, {id:2,Name:'22'}, {id:3,Name:'33'},
2020-09-18 10:31:18
5440
2
原创 js代码获取上传的json文件内容
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <input typ
2020-09-12 12:17:02
1261
原创 mui日期组件（原生日历样式）
需求：需要通过时间限定数据的查找范围，样式如下<div class="mui-row" style="padding: 8px 8px 0 8px;"> <div class="mui-col-sm-5" > <input id='StartDate' type="text" class="mui-input-clear" placeholder="选择开始日期" > </div> <div class="mui-col-sm-1
2020-08-07 15:20:56
1438
原创 mui组件的下拉刷新上拉加载实现
引入mui组件官方ji,css是必不可少的//最开始初始化mui.init({ pullRefresh: { container: '#pullrefresh', down: { style: 'circle', offset: '0px', auto: true,//可选,默认false.首次加载自动上拉加载一次, callback: pulldownRefresh //返回调用的函数 }, up: { auto:true, contentrefr
2020-08-05 15:14:35
266
原创 vue中Element使用Tab渲染Echarts图表显示出错
父组件用elementUI的tab放了几个tab页面(具体几个按照数据来定),在子组件中,无法通过给echarts盒子设置width:100%来使echarts图表自适应浏览器页面大小每次打开tab也。图表都会出现变小，无法获取具体的大小这个时候通常可以使用最简单的方式：给图表添加定宽就可以实现，如果想要实现自适应，rem，vh等都可以实现就是不能用百分比让宽度自适应当然还有别的实现方案，获取resize让它重新渲染，，都是可以的...
2020-07-25 11:39:19
372
原创 vue中实现通过SignalR获取端口数据（websocket）& 实时数据推送
首先，介绍一下SignalRASP .NET SignalR 是一个ASP .NET 下的类库，可以在ASP .NET 的Web项目中实现实时通信。什么是实时通信的Web呢？就是让客户端（Web页面）和服务器端可以互相通知消息及调用方法，当然这是实时操作的。WebSockets是HTML5提供的新的API，可以在Web网页与服务器端间建立Socket连接，当WebSockets可用时（即浏览器支持Html5）SignalR使用WebSockets，当不支持时SignalR将使用其它技术来保证达到相同效果
2020-07-25 11:27:50
2126
1
原创 vue中实现Echarts折线图多数据动态显示
可以复制搜索看看是否是想要的效果https://gallery.echartsjs.com/editor.html?c=xtdeZMuQ4t也就是折线图1秒或者几秒获取一次数据（通过Signal请求端口数据），当然请求数据库也是可以实现的，但是对于数据库性能也是特别消耗的，现在先看看动态的折线图是如何实现的吧//////////////////////////////==============================================================子组件
2020-07-25 11:12:56
4276
原创 JS打印分页（上下内容固定，中间内容动态渲染）
直接打印 var btn = mini.getbyName("btn_directPrinting", this); btn.on('click', function () { this.directPrinting(); }, this); directPrinting: function () { var LODOP; LODOP = getCLodop(); LODOP.PRINTA(); },打印预览
2020-07-16 15:13:49
519
原创 vue中Excel文件的导入导出实现
首先了解Excel的导入导出实现效果，就是想要通过导入导出将所需要的数据进行合理的存放，那么下面了解一下导入导出实现的过程~~Excel的导入导入就是通过input有个file的属性来实现，并且导入想要实现的效果就是需要弹出一个面板控制导入的数据，以下是通过ElementUi组件来实现的 //点击导入按钮<el-tooltip class="item" effect="dark" content="导入Excel" placement="left"> <el-button ty
2020-07-03 10:13:57
2285
原创 npm ERR! [email protected] install: `node install.js`
在npm install时，出现了这个问题，该问题是vue-cli脚手架的一个bug，原因是chromedriver的部分文件无法下载完整的chromedirver包，解决办法：通过淘宝镜像去下载chromedriver文件npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver然后再npm install就没有问题了...
2020-06-30 16:43:02
840
原创 ElementUI组件Rate(评分效果)的数据动态渲染
首先通过此链接https://element.eleme.cn/#/zh-CN/component/rate在官网上找到评分的实例，可以参照里面的组件属性、方法进行一系列的操作以下我将一一展示rate评分的常用效果<el-rate v-model="rateValue"//双向绑定数据 show-text//展示提示的文字 :texts="text"//自定义提示文字信息 allow-half//允许半选 @change="changeValue"//官网上
2020-06-30 10:53:55
8348
9
原创 移动端（rem）布局
在移动端布局的过程中，我们可以通过设置表头并且添加相应的样式让页面响应式布局<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">样式中添加html,body{font-size:100px;}然后接下来就可以写rem布局的其他样式了，但是有些时间pc端也是需要响应式布局的，通过响应式
2020-06-08 17:44:12
168
原创 通过css四个角边框的实现
想要实现的效果现在只有四个角，而想要实现整个边框的绘制，所需部分重要css代码如下，可供参考.Border{ position: relative; background-image: url(../../Images/border/lt.png), url(../../Images/border/rt.png), url(../../Images/border/ld.png),
2020-06-04 11:56:48
2740
原创 Swiper列表轮播动态获取数据最后一页数据陷入死循环问题
当获取数据时，在下方代码中添加loop:true；autoplay:true;会实现页面的动态循环;让循环的每一页显示6条数据，每次循环6条数据，但是出现的问题是，当数据的数量少于或者大于的时候，就会出现轮播的时候最后显示的几条数据陷入死循环（无限循环最后几条数据）状态，而造成这个死循环的原因就是数据的过多或过少，当数据显示的刚好是每一页的倍数是，比如6，数据有12条、18条、24条都不会出现问题，而当数据有15条或者20条的时候就会出现死循环的状态，目前的解决方案就是需要将数据的数量控制在所需范围之
2020-06-04 11:47:58
996
5
原创 Uncaught TypeError:Cannot read property el of null
一般情况下，这种报错是因为由于有些代码没有写合适，包括所在页面的引用路径，逗号分号有没有写合适，还有所用的变量是否的完整，仔细检查一下就没有报错了，不会是因为底层的报错哒...
2020-05-30 15:40:07
1328
原创 miniUI相同模块中实现不同显示效果
在项目中，有很多模块其实想要实现的效果差不多，这个时候都会选择调用相同的模块，但是显示效果又会有些许不同，所以我们需要通过传参的不同实现不同的显示效果open:function(url, name,parm){ var url = url+ "?Id=" + row.Id + parm; } btn.onclick=function(){ this.open(url,"&isEdit=false")//传递一个值使这个值跟其他的不一样 }主要思路是这样，
2020-05-25 15:00:57
249
原创 miniUI显示隐藏元素的方法
在原生中总是会使用document.getElementById().style = "display:none"的方法实现元素的隐藏，但是在miniUi组件库内有其自己封装的方法：dataGrid.hideRowDetail()隐藏行元素dataGrid.hideColumn()隐藏列mini.getbyName("获取隐藏元素的name").hide()mini.getbyName("获取隐藏元素的name").setVisible(false/true);//false表示隐藏 t
2020-05-25 14:30:28
4471
原创 Js页面打印组件实现
官网：Js页面打印组件官网可以通过此处进到lodop的官网，然后在官网上查询相关的参数方法，所包含的方法函数如下：● PRINT_INIT(strPrintTaskName)打印初始化● SET_PRINT_PAGESIZE(intOrient,intPageWidth,intPageHeight,strPageName)设定纸张大小● ADD_PRINT_HTM(intTop,intLeft,intWidth,intHeight,strHtml)增加超文本项● ADD_PRINT_TEXT(i
2020-05-23 17:12:35
1150
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人