自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 js手写题收录

【代码】js手写题收录。

2023-08-17 19:09:50 84

原创 实现小程序控制页面初始化或切换时作品列表刷新的可控

小程序体验感和数据更新的处理

2023-02-18 16:26:52 202

原创 mac invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library

mac升级到最新版本系统Monterey后,执行git命令时候出现:xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun可能是因为 xcode 的版本和新的系统不适应导致的,我们需要更新一下xcode的版本解决方法:打开终端输入xcode-select --ins

2022-06-16 17:39:46 1315

原创 小程序生命周期里的异步执行问题

前言这篇文章主要想把之前主导的一个技术项目中,关于处理小程序生命周期内异步问题提炼一下。主要的场景就是在用户扫码进入小程序时,首先触发小程序的 onLoad 方法,在 onLoad 内可能发起请求解析太阳码中的参数,得到的参数如果参与了 onShow 内部的逻辑。但则要面临一个问题:onLoad 和 onShow 是同步执行的,但由于 onLoad 内部存在异步请求过程,导致 onShow 中的逻辑可能先执行,从而导致报错,业务流程终端。onLoad:页面第一次加载时触发,从跳转页面返回时不能触发,可

2022-04-28 00:32:12 1423

原创 如何利用chrome进行内存泄露分析

使用 Chrome 自身的任务管理器判断Chrome -> 设置 -> More Tools -> Task Manager确保 Task Manager 的 Memory Footprint 与 JavaScript Memory 列已显示表格列右键,勾选需要显示的列在系统中随意操作,或模拟用户正常操作观察 Task Manager 中的使用情况,如符合一下特征的基本可以确定存在内存泄露每次操作内存均有所上升操作较长时间后内存持续一直上涨使用 DevTools 辅助判

2022-04-19 11:20:22 3636

原创 js 设计模式一讲:工厂+单例+原型

其实在初学前端时,并没有太过于在意设计模式这一码子事。因为追求效率之上,其实这些基础还是很重要的,如果不好好打好基础,养成野路子的思维,对于js这么灵活的语言,在一些地方会感到之分的痛苦!!!本期介绍一下三大模式工厂模式工厂模式中,我们在创建对象时不会对客户端暴露创建逻辑,并且是通过使用一个共同的接口来指向新创建的对象,用工厂方法代替new操作的一种模式。class Creator { create(name) { return new Animal(name) }

2022-03-20 01:45:40 173

原创 useContext

什么是useContext在Hooks出来之前,开发者都是使用的class组件,通过props传值。现在使用方法组件(Function)开发了,没有constructor构造函数也就没有了props的接收,所以父子组件的传值就成了一个问题。React Hooks就为我们准备了useContext来解决这个问题。useContext的作用1.useContext可以帮助我们跨越组件层级直接传递变量,实现数据共享。这里要注意的是,很多同学觉得可以使用useContext结合useReducer来替代r

2022-03-03 11:40:08 2251

原创 ios与安卓底部按钮与输入框的兼容性

iphoneX 与之前机型对比iphoneX 安全区域PhoneX的适配,在iOS 11中采用了viewport-fit的meta标签作为适配方案;viewport-fit的默认值是auto表头表头auto默认:viewprot-fit:contain;页面内容显示在safe area内coverviewport-fit:cover,页面内容充满屏幕 <meta name="viewport" content="width=device-width,.

2021-11-08 18:54:03 2595

原创 react 组件逻辑复用

组件逻辑复用React为什么设计成组件化的形式?其实最大的原因就是为了方便复用。然而组件的复用虽然方便,逻辑的复用却很麻烦,因为state的存在,逻辑被锁死在组件内部,很难分离出去。高阶组件(HOC)实现逻辑复用import React from "react";const Count = ({ count, add, minus, theme, changeTheme }) => { return ( <div style={{ backg.

2021-09-06 15:24:52 474

原创 关于margin的塌陷和合并问题

margin塌陷父子嵌套元素在垂直方向的margin,父子元素是结合在一起的,他们两个的margin会取其中最大的值.正常情况下,父级元素应该相对浏览器进行定位,子级相对父级定位.但由于margin的塌陷,父级相对浏览器定位.而子级没有相对父级定位,子级相对父级,就像坍塌了一样.<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title>

2021-04-14 11:17:07 230 3

原创 网络协议一讲

有这么一个经典的小问题:Q: 为什么有时候网页访问连接失败,但QQ能够连上?A:QQ直接使用IP地址连接服务器,而网络用的是DNSTCP/IP协议族TCP/IP 是互联网相关的各类协议族的总称,按层次分别分:应用层、传输层、网络层和数据链路层接收端的服务器在链路层接收到数据,按序往上层发送,一直到应用层。当传输到应用层,才能算真正接收到由客户端发送过来的 HTTP请求发送端在层与层之间传输数据时,每经过一层时必定会被打上一个该层所属的首部信息。反之,接收端在层与层传输数据时,每经过一层时会

2021-02-24 10:12:45 698

原创 判断移动端所处浏览器环境:ios, android....的方法

分享一个能够在代码中判断网页所处浏览器环境的方法,还是直接上代码:ios // ios终端android // android终端或者uc浏览器wechat // 微信wechatMiniprogram // 微信小程序const browser = { get versions() { const userAgent = window.navigator.userAgent; return {

2021-02-18 11:33:35 330

原创 安卓+ios的输入框弹出键盘时,导致fixed或absolute定位的按钮顶上去的问题

如上图所示:在移动端中input唤起输入框的时候,会导致底部被fixed或者absoluted的button被顶上去,解决的第一思路就是要监听到输入框弹起的事件,对此解决方案要分为ios和android两种情况以react为例,废话不说,直接上代码视图层 :xxx.tsx // 利用窗口尺寸变化监听android输入框唤起和消失,利用聚焦失焦监听ios输入框唤起和消失 const [resizeChange, setResizeChange] = useState(0) const [fo.

2021-02-09 16:05:22 2023

原创 CSS的优化原理

浏览器加载过程reflow(回流):当浏览器发现某个部分发生了点变化影响了布局,需要倒回去重新渲染,内行称这个回退的过程叫 reflow。reflow 会从 这个 root frame 开始递归往下,依次计算所有的结点几何尺寸和位置。reflow 几乎是无法避免的。现在界面上流行的一些效果,比如树状目录的折叠、展开(实质上是元素的显 示与隐藏)等,都将引起浏览器的 reflow。鼠标滑过、点击……只要这些行为引起了页面上某些元素的占位面积、定位方式、边距等属性的变化,都会引起它内部、周围甚至整个页

2021-02-08 16:37:53 120

原创 本地存储解决方案思考

关于H5项目中本地储存机制的思考浏览器缓存浏览器缓存(Browser Caching)是为了节约网络的资源加速浏览,浏览器在用户磁盘上对最近请求过的文档进行存储,当访问者再次请求这个页面时,浏览器就可以从本地磁盘显示文档,这样就可以加速页面的阅览用处减少请求频率,减轻服务器压力减少加载时间,提升用户体验实现跨页面通信在C端的项目中由于页面大小有限,相比于B端为了实现更多的功能,只能增加页面的层级关系和互相跳转。以H5为例,用户在外卖选择自己地址=》点单=》下单=》支付=》详情,这些都是彼此独立

2020-12-25 15:31:17 502

原创 git报错:“Please enter a commit message to explain why this merge is necessary,especi”的解决办法

git 报错有时候在合并分支时,偶尔会产生报错如下:这个时候界面被锁死,解决方法如下:输入“:wq”,注意是英文输入状态下的冒号,然后按下“Enter”键即可。再次打开Git时就会发现已经合并成功,提交就行了...

2020-07-14 10:16:26 476

原创 npm 报错: Error: ENOENT: no such file or directory, mkdir

昨天刚作为一个应届生入职公司,在新电脑上安装node后,尝试npm -v后报错Error: ENOENT: no such file or directory, mkdir D:\因为我压根就只有一个C盘,所以这个问题让我很是困惑。试了很多遍重新安装,但依然解决不了问题。知道在网上找到了一个解决方法。其实这个就是在C:\Users\Administrator(注意这里不一定是Administrator,也有可能是你自己设置过得用户名)目录下的.npmrc里的配置问题。prefix=D:\node.j

2020-07-11 20:09:31 5949

原创 mobx装饰器报错Support for the experimental syntax &#39decorators-legacy&#39 isn&#39t currently enabled

Support for the experimental syntax 'decorators-legacy' isn't currently enabled

2020-06-15 21:48:57 522

原创 Redux小白学习笔记

Redux学习笔记Redux简介StoreactionReducerReact-ReduxconnectmapStateToPropsmapDispatchToPropsProviderredux-thunkaction creatorRedux本篇学习笔记是针对自己的项目所写的,所以有看不懂的地方要或者更多的注释和细节需要参加全栈小项目(react+redux+koa+mongo)中的(/client/src)部分,欢迎点赞支持~简介首先关于react中redux环境的搭建:cnpm i red

2020-06-07 19:19:46 279 1

原创 前端设计模式重点总结

其实在初学前端时,并没有太过于在意设计模式这一码子事。因为追求效率之上,其实这些基础还是很重要的,如果不好好打好基础,养成野路子的思维,对于js这么灵活的语言,在一些地方会感到之分的痛苦!!! 这里首先介绍一下几种设计模式单例模式定义:保证一个类仅有一个实例,并提供一个访问它的全局访问点。实现方法:先判断实例存在与否,如果存在则直接返回,如果不存在就创建了...

2019-08-16 17:55:55 235

原创 win10下搭建vue环境常见错误

本人win10,整理一些常见的npm报错与大家分享 ERROR 1~~~~~~~~~~~~ npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! [email protected] install: node install.js npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the chr...

2018-05-23 09:43:04 1190

空空如也

空空如也

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

TA关注的人

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