- 博客(65)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 JS设计模式-单例模式
单例模式：限制类只能有一个实例化对象。模式特点：类只有一个实例全局可访问推迟初始化（与静态类，对象的区别）主动实例化实现方法：创建一个类，这个类包含一个方法。在没有对象的情况下，这个方法会创建一个新的实例对象。如果对象存在，则只返回对象的引用地址。应用场景：登录弹窗购物车命名空间引入第三方库（多次引用只会使用一个库引用，如jQuery）全局态管理store-Vuex优缺点：优点：适用于单一对象，只生成一个对象实例，避免频繁创建和销毁实例，减少内存占用缺点：不适用.
2022-03-17 17:52:46
4991
1
原创 cordova 打包vue项目为apk
Apache Cordova是一个开源的移动开发框架。允许你用标准的web技术-HTML5,CSS3和JavaScript做跨平台开发。 应用在每个平台的具体执行被封装了起来，并依靠符合标准的API绑定去访问每个设备的功能，比如说：传感器、数据、网络状态等。实现目标：讲一个vue项目打包为apk使用。由于这个项目是已有的项目，重写工作量太大，所以无法使用uniapp。上网了解到可以使用Cordova，将一个vue项目打包为apk。准备工作：安装cordova$ npm install -g.
2021-06-01 17:41:59
519
2
转载 ES2020新特性
https://baijiahao.baidu.com/s?id=1657755693419357073&wfr=spider&for=pc
2021-02-05 16:26:16
176
原创 axios 使用get方式下载文件
之前下载文件都是使用 windows.location.href ，点击直接下载后台已经生成好的文件。最近接触vue项目，学习了一种后台传输文件流，前台使用blob方法接收文件流，记录如下。导出方法：uploadFile(name, type, title){ downloadExcel({name, type}).then(rst => { this.downloadFile(rst,title);
2021-01-28 16:49:24
3559
原创 多行文本省略
.des{ overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp:2; -webkit-box-orient: vertical; display: -webkit-box; overflow-wrap: break-word; }
2021-01-26 15:50:45
83
原创 reduce()方法的学习和整理
今天看文章的时候看到reduce方法去做循环比较是较为优雅的写法，遂学习了一波，现整理如下。文章链接：https://www.jianshu.com/p/e375ba1cfc471. 语法reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。reduce() 可以作为一个高阶函数，用于函数的 compose。注意: reduce() 对于空数组是不会执行回调函数的。arr.reduce(callback,[initialValue])callb
2020-12-30 17:51:35
639
原创 浏览器兼容汇总
360浏览器密码框填充一般情况下，网站记住密码后，表单的密码框会自动填充。针对这种情况，在表单内加一个隐藏元素，设置type = password，默认密码就会填充在这里，不影响真正的密码框。但是360浏览器渲染页面时，先渲染正常元素，再渲染隐藏元素，导致上述方法失败。针对这种情况，用css的方法调整假密码框。1.1 z-index.password{ z-index:-10; position:relative;}1.2 transformtransform: rotateY.
2020-11-25 10:35:43
78
1
原创 设置文本向两边居中展示
.reason .reasonContent > span{ width: 52px; text-align: justify; display: inline-block; } .reason .reasonContent> span::after{ content: ""; display: inline-block; width: 100%; }
2020-11-11 15:36:34
91
原创 记录关于git提交的问题
今天提交代码遇到了一个比较严重的问题。公司的代码管理是每个需求，每个bug建立一个分支。今天修改一个bug时，我从一个分支切到另一个分支上时，分支未加载完先使用idea内置的git，pull代码，也没有仔细看，就将另一个分支上的代码拉到本地分支上了。用idea提交时，我发现有多个commit需要push，意识到了不对，又回到了tortoiseGit重新pull分支代码，但是没有拉到代码，就抱着侥幸的心理选择了push，以为会让我勾选要提交的文件，但是忘记了之前在idea内已经commit过了，所
2020-11-06 16:32:21
114
原创 IOS 真机的时间getFullYear()返回值为NAN的问题
问题：HTML页面上，安卓和浏览器模拟器，获取的时间都正确，ios真机显示为一串NAN问题原因：兼容性问题解决：将时间格式的 - 替换为 /new Date("2017-02-16 20:41:10".replace(/-/g,'/')).getFullYear()
2020-09-23 10:03:14
561
原创 H5 + ajax 实现文件上传
利用H5的特效，file来实现文件上传 <input id="toSelectImage" type="file" accept="image/*">设置toSelectImage元素隐藏，点击上传按钮时，js触发该元素点击$('#toSelectImage').click()监听该元素的change事件 $('#toSelectImage').change(function (e) { var files = e.target.files || e.d
2020-08-03 17:34:52
500
原创 滚动条问题，未解决
表格超出区域设置其为visible,可见；但是单独设置overflow-y:visible失败，还是出现滚动条而设置其为overflow: visible又成功了未找到原因，也不是很理解为什么
2020-07-09 16:01:24
125
原创 css 实现文字泡
使用伪元素的方法，生成一个直角三角形，再用绝对定位，将其放到合适的位置。header .header-top-content div { background-color: rgba(255,255,255,0.25); padding: 0.1rem 0.12rem 0.1rem 0.34rem; min-height: 1rem; color: rgba(255,255,255,0.8); line-height: 0.34rem; font-siz
2020-07-08 17:44:49
214
原创 css实现边框渐变
.actionBox { border-radius: 0.16rem; width: 7rem; margin: 0 auto; background-color: #D9D9D9; padding: 0.4rem; line-height: 0.68rem; font-size: 0.32rem; position: relative; border: 2px solid transparent; }.actionBox::.
2020-07-07 11:21:31
467
原创 JavaScript学习
开启定时器console.time('test') //开启计时器console.timeEnd('test') //关闭计时器，都需要一个标识js开方Math.sqrt(36)in运算符通过in运算符可以检查一个对象中是否含有指定属性。返回结果为true、falseconsole.log("test" in obj)数据类型保存的内存空间基本数据类型基本数据类型的值直接在栈...
2020-06-30 12:07:35
124
1
原创 块格式化上下文 BFC
块格式化上下文（Block Formatting Context，BFC）是Web页面的可视CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。根元素(<html>) 浮动元素（元素的float不是none） 绝对定位元素（元素的position为absolute或fixed） 行内块元素（元素的display为inline-block） 表格单元格（元素的display为table-cell，HTML表格单元格默认为该值）...
2020-06-30 12:00:02
83
原创 call，apply的区别和理解
apply()的用法apply() 方法调用一个具有给定this值的函数，以及作为一个数组或者类似数组对象提供的参数。func.apply(thisArg, [argsArray])thisArg必填，指的是在这个func函数运行时使用的this值。在非严格模式下，thisArg被指定为null或者undefined时会被自动替换为指向全局对象，原始值会被包装。argsArray可选，一个数组或者类似数组对象。其中数组元素将作为单独的参数传给func函数，如果该值的null或者undef
2020-06-30 11:43:27
198
原创 使用git的步骤
1、打开git bash2、本地创建ssh keyssh-keygen –t rsa –C “[email protected]”多次点击回车在指定位置生成id_rea.pub文件进入指定目录，通过记事本打开id_rsa.pub，复制里面的key。进入git官网，点击添加ssh密钥3、验证ssh密钥ssh -T [email protected]看到You’vesuccessfully authenticated, but GitHub does not pr
2020-06-16 16:37:44
143
原创 css 美化单选按钮和复选按钮
<div class="checkAgreement"> <input type="radio" id="checkSure" class="checkSure"> <label for="checkSure"></label> </div>.checkAgreement .checkSure{ opacity: 0;}.checkAgreement input[type=radio]:checked+label{ ..
2020-05-16 11:36:53
284
原创 JS函数的节流和防抖
看了一篇很形象的文章形容节流和防抖。附上链接：https://mp.weixin.qq.com/s/3FZJ0nQLhj9PCi0pfBjc9A粗暴且不是很正确的理解就是：节流主要是用于表单重复提交；防抖主要用于某个操作导致短时间内大量执行某些操作节流函数借鉴了大佬文章：https://www.cnblogs.com/yfgg/p/11663433.html function throttle (me, key, fn, delay = 1000) { let pre =
2020-05-15 18:39:57
134
原创 网页，鼠标滑动切换一屏
var isFF=/FireFox/i.test(navigator.userAgent); var change = document.documentElement.clientHeight - 75; var scrollHeight = document.body.scrollHeight - change -75; var box = $('.wrapItem img').width(); $('.headNav').css('width',box+'px...
2020-05-15 16:26:06
1252
2
原创 H5页面判断是安卓还是ios
AndroisIos(){ let u = navigator.userAgent; let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS ...
2020-05-08 14:47:48
755
原创 mpvue 踩坑记
1. 切换到自定义文件夹2. vue init mpvue/mpvue-quickstart demo (demo为自定义项目名)2. cd demo 进去新建项目文件夹内3. npm install 初始化项目4. npm run dev5. 打开微信开发者，导入项目，然后就可以敲代码啦...
2020-04-27 14:30:15
138
原创 浏览器获取摄像头设备列表，并选择设备
前段时候接到一个需求，新增功能：根据当前电脑绑定了几个摄像头，获取相应摄像头列表， 并选择摄像头拍摄。翻阅网上的各种资料，没有找到方法，最后借鉴了H5页面转换前后摄像头的方法，记录如下。1. 先通过 navigator.getUserMedia 调用起本地的摄像头2. 调用成功之后获取到本地电脑所有的摄像头设备列表 navigator.mediaDevices...
2020-04-27 13:53:06
6480
7
原创 静态圆环进度图，进度条
由于之前对需求了解不请求，将仪表盘做成了圆环进度图，代码也附上来吧，以做参考。方法参考了某个大佬写的，但是找不到文章了，请见谅。主要实现方法是用用HTML+csshtml :<div class="circle"> <div class="circle-bar"> <div class="circle-bar-left"></...
2019-12-18 16:19:49
352
原创 echarts 仪表盘进度图
实现效果如下：引用了echarts插件，代码如下：// 基于准备好的dom，初始化echarts图表 var myChart = echarts.init(document.getElementById('chart')); option = { series: [ { name: '百分比100%', t...
2019-12-18 16:13:47
2815
原创 预览图文--galpop插件的使用
参考文章：https://blog.csdn.net/MPFLY/article/details/99682770#commentBox公司需求，需要预览表格内的图片。学艺不精，遍寻网络，找到了一个galpop插件，符合需求，功能强大。官网介绍由于表格是在js里面写的，使用时我遇到了一个问题，图片预览每次都是打开了一个新的iframe层，展示效果不好，不断的测试排除原因，发现是因为打开图片...
2019-11-10 16:10:25
346
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人