- 博客(43)
- 收藏
- 关注
原创 IntersectionObserver实现页面滚动时候监听指定元素进入,滚动出页面可视区域事件
IntersectionObserver监听指定元素的滚动到页面可视区域
2022-05-16 18:10:59
735
原创 npm run dev/build内存溢出解决方法,亲测有效(JavaScript heap out of memory)
npm run dev内存溢出解决方案
2021-12-11 14:57:25
19421
8
原创 2021-11-08
解决下载vscode慢的问题mac下载地址https://vscode.cdn.azure.cn/stable/b3318bc0524af3d74034b8bb8a64df0ccf35549a/VSCode-darwin-universal.zip以上是mac下载地址,下载vscode版本为 2021.11.08 当前日期最新版本
2021-11-08 15:49:03
69
原创 手写shallowReadonly和readonly
const readonlyHandler = { get(target, prop) { return Reflect.get(target, prop) }, set(target, prop, val) { console.error('只读属性,不支持修改') return true }, deleteProperty(target, prop) { console.error('只读属性,不支持
2021-10-16 21:49:21
94
原创 vue中Hook Event实现原理
什么是Hook Eventhook event 是vue自定义事件结合其生命周期函数实现从组件外部为组件内部添加钩子函数的实现方法Hook Event 实现原理在vue处理组件自定义事件时候(通过vm.$on处理自定义事件),如果发现组件上有绑定hook:xx格式的事件(xx表示vue的生命周期函数),则将标记组件有hook event(通过设置vm._hasHookEvent设置为true)然后在组件的生命周期函数执行时,会通过内部的callHook方法来执行对应的生命周期函数,生命周期函数
2021-10-09 16:54:23
326
原创 vue中使用html5的drag实现任意位置拖动
最近做的一个项目,需要拖动配置,网上找了一圈 没找到合适的轮子,没办法自己写吧,代码中有能优化的地方,没时间优化了(其实就是懒得),希望能帮到需要的人。效果图如下:可以充设备组件拖动到右侧容器中,设备组件栏中对应删除拖出去的数据,右侧容器则添加对应数据,反之亦然(从右侧拖动设备组件放回左侧设备组件栏时也是删除右侧拖出数据,设备栏添加相关数据)环境组件栏:拖动组件到右侧容器,组件栏数据保持原样,右侧容器添加对应拖动数据。从右侧容器拖动环境组件放回组件栏,容器删除对应数据,环境组件栏保持原样右侧容器中
2021-08-24 15:11:45
2445
1
原创 封装ajax(promise封装)
function ajax(options) { const xhr = window.XMLHttpRequest ? new XMLHttpRequest : new ActiveXObject; const method = options.method.toLocaleLowerCase() || 'get'; const url = options.url + '...
2020-03-30 14:24:15
192
原创 instanceof 原理
// **右边变量原型存在于左边变量的原型链上**function instanceon(left, right) { let leftValue = left._proto_; let rightValue = right.prototype; while (true) { if (leftValue === null) { re...
2020-03-30 14:23:01
144
原创 js数组去重
这里只介绍3中数组去重,当然数组去重并不是只有这3中方法,目前我知道的是有一位大神写出了16种方法// ! 数组去重// 1. es6 的setlet array1 = [1,2,2,3,44,44,5,false,false,true,true,null,undefined,null,NaN];let array2 = [];array2 = [...new Set(array1)]...
2020-03-29 17:31:03
114
原创 js实现一个vue的双向绑定
直奔主题,看代码// ! 实现一个双向绑定/** * Object.defineProperty(obj, prop, descriptor) * {obj} 要定义属性的对象。 * {prop} 要定义或修改的属性的名称或 Symbol 。 * {descriptor} 要定义或修改的属性描述符。 */let obj = { text: 0};let input = ...
2020-03-29 16:25:15
147
原创 节流函数,防抖函数
直奔主题,看代码// !节流函数// 在规定时间内只触发一次function throttle(fn, wait) { let prevDate = Date.now(); return function () { let _this = this; let arg = arguments; let nowDate = Date...
2020-03-29 16:22:57
114
原创 js浅拷贝和深拷贝的实现
浅拷贝// 1. ...实现let copy1 = {...{x: 1}};// 2. Object.assign实现let copy2 = Object.assign({}, { x: 1});深拷贝// 1. JOSN.stringify()/JSON.parse() // 缺点:拷贝对象包含 正则表达式,函数,或者undefined等值会失败let obj = ...
2020-03-29 16:20:53
156
原创 混合开发中,H5页面与原生app交互(方法互相调用与传参)
H5与原生app交互,需要WebViewJavascriptBridge,废话不多直接上代码,下面是项目中的封装bridge.js的全部代码(示例代码为vue)//iOS 交互声明function connectWebViewJavascriptBridgeIOS(callback) { if (window.WebViewJavascriptBridge) { return ca...
2019-11-30 17:52:26
11711
原创 js事件委托
废话不多直接上代码<ul id="ulCont"> <li>111</li> <li>222</li> <li>333</li> <li>444</li></ul>window.onload = function () { var ele...
2019-11-21 18:13:42
102
原创 null,undefined," "的区别, typeof null 和 typeof undefined
此文章只是为了自己方便记忆写的随笔都知道 JavaScript 数据类型有:字符串值(string),数值(number),布尔值(boolean),数组(arry),对象(object)。Null在 JavaScript 中,null 是 “nothing”。它被看做不存在的事物。不幸的是,在 JavaScript 中,null 的数据类型是对象。您可以把 null 在 JavaS...
2019-11-21 16:14:24
874
原创 promise,settimeout,async执行顺序笔记式理解
前言:为什么要写这篇文章?很简单,面试被虐了!对就是这么简单。为了挽回颜面,事后马上恶补了一下这方面的知识。俗话说(真理):好记性不如烂笔头,怕忘记就写了这篇文章,同时也是为了完成自己前几天立的flag,一个月写一篇文章,下面正式进入正题当时面试题具体啥样子忘记了,从网上找到了类似的面试题,好像是头条的面试题 async function async1() { console.log(...
2019-11-20 18:59:34
293
原创 audio标签无法播放amr格式音频解决方案(benz-amr-recorder)
遇到此问题的情形:单位开发app采用的Hybrid混合开发模式,有些列表页,详情页都是H5页面,我这边的框架是vue写的。最近一个项目中涉及到了视频和音频的展示和播放,因为app有安卓端和ios端,视频和音频的上传都是原生去上传的,然后再详情页中需要展示出来,ios中音频没遇到问题,因为ios自己录音生成的是.mp3格式音频,所以用audio标签可以完美播放。(audio标签支持的格式只有MP3...
2019-09-09 10:14:13
13743
22
原创 require中使用ali-oss上传视频采坑
require中使用ali-oss上传视频之前项目试vue框架,使用ali-oss没问题,最近一个项目试require写的,然后使用ali-oss时候就有问题了,在我上传视频的时候报错了,如下:之前项目试vue框架,使用ali-oss没问题,最近一个项目试require写的,然后使用ali-oss时候就有问题了,在我上传视频的时候报错了,如下:问题出在以下代码,只要有async / awai...
2019-09-03 12:19:33
1152
原创 vue中keep-alive缓存滚动条
前言这几天公司在做一个app,需要嵌套H5页面,于是H5页面的编写就落到了本人的手里,啥都不说just do it 别逼逼!项目过程中因为做的页面是列表页和详情页,为了接近原生和用户体验好,所以在列表和详情路由切换时候就要缓存列表页数据(路由跳转就是 列表➡详情返回到➡列表),使用户体验更好怎么实现keep-alive第一步,在路由元信息里配置需要缓存的页面,我用的keepAlive表示...
2019-07-03 17:28:03
5019
2
原创 swiper鼠标经过切换对应轮播图
实现鼠标经过缩略图(分页器,也就是下面的小圆点)实现自动切换直接上代码<div id="gallery-thumbs"> <div class="swiper-wrapper indexP-swiper-cont"> <div class="swiper-slide indexP-swiper-items" data-index="1">...
2019-06-28 17:27:06
4611
原创 数组去重的多种方法
数组去重的方法有很多,废话不多说下面只写3种,分别是从复杂到简单:1.利用forEach进行轮询需要去重的数组,然后通过判断新数组(这个新数组需要在轮询之前创建一个空数组)中是否包含进行添加不重复的每一项得到新数组此方法的缺点需要新建一个数组需要进行轮询,性能方面不是很好,代码不简练function removeDup(arry) { let nomalAyy = []; ...
2019-04-08 18:31:57
300
转载 移动端常见的ios和安卓兼容性问题
转载地址 https://www.cnblogs.com/wangpenghui522/p/5398137.html
2019-04-03 09:29:32
1555
原创 vuex详解及用法
什么是vuex?官方解释(vue官网文档):Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。对于初学者来说,当看到上面这段话的时候是这个样子的:原(这)来(是)是(什)这(么)样(啊),什么是 状态 啊,大神请忽略这种情况,小白们不要慌,请看下面的通俗(其实就是本人认为的)解释,如...
2019-03-31 00:16:24
350
原创 vue组件间的通信
vue组件通信本人大致总结有4中方法路由传参(params)本地存储(localstorage,sessionstorage等)事件中转(通过let evnet = new Vue,event.$emit()和event.$on()来实现)vuex(vue官方推介)这4种方式的具体操作,请等待跟新(别喷)...
2019-03-19 18:25:58
105
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人