前端
关注
分享
扫一扫
文章平均质量分 58
any_fight
一个从化工转行前端开发的小菜鸟~希望大家多多指教啊
展开
-
实现小程序控制页面初始化或切换时作品列表刷新的可控
小程序体验感和数据更新的处理原创 2023-02-18 16:26:52 · 365 阅读 · 0 评论 -
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 · 1358 阅读 · 0 评论 -
小程序生命周期里的异步执行问题
前言这篇文章主要想把之前主导的一个技术项目中，关于处理小程序生命周期内异步问题提炼一下。主要的场景就是在用户扫码进入小程序时，首先触发小程序的 onLoad 方法，在 onLoad 内可能发起请求解析太阳码中的参数，得到的参数如果参与了 onShow 内部的逻辑。但则要面临一个问题：onLoad 和 onShow 是同步执行的，但由于 onLoad 内部存在异步请求过程，导致 onShow 中的逻辑可能先执行，从而导致报错，业务流程终端。onLoad：页面第一次加载时触发，从跳转页面返回时不能触发，可原创 2022-04-28 00:32:12 · 1617 阅读 · 0 评论 -
如何利用chrome进行内存泄露分析
使用 Chrome 自身的任务管理器判断Chrome -> 设置 -> More Tools -> Task Manager确保 Task Manager 的 Memory Footprint 与 JavaScript Memory 列已显示表格列右键，勾选需要显示的列在系统中随意操作，或模拟用户正常操作观察 Task Manager 中的使用情况，如符合一下特征的基本可以确定存在内存泄露每次操作内存均有所上升操作较长时间后内存持续一直上涨使用 DevTools 辅助判原创 2022-04-19 11:20:22 · 3847 阅读 · 0 评论 -
js 设计模式一讲：工厂+单例+原型
其实在初学前端时，并没有太过于在意设计模式这一码子事。因为追求效率之上，其实这些基础还是很重要的，如果不好好打好基础，养成野路子的思维，对于js这么灵活的语言，在一些地方会感到之分的痛苦！！！本期介绍一下三大模式工厂模式工厂模式中，我们在创建对象时不会对客户端暴露创建逻辑，并且是通过使用一个共同的接口来指向新创建的对象，用工厂方法代替new操作的一种模式。class Creator { create(name) { return new Animal(name) }原创 2022-03-20 01:45:40 · 339 阅读 · 0 评论 -
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 · 2706 阅读 · 0 评论 -
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 · 526 阅读 · 0 评论 -
关于margin的塌陷和合并问题
margin塌陷父子嵌套元素在垂直方向的margin,父子元素是结合在一起的,他们两个的margin会取其中最大的值.正常情况下,父级元素应该相对浏览器进行定位,子级相对父级定位.但由于margin的塌陷,父级相对浏览器定位.而子级没有相对父级定位,子级相对父级,就像坍塌了一样.<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title>原创 2021-04-14 11:17:07 · 315 阅读 · 3 评论 -
网络协议一讲
有这么一个经典的小问题:Q: 为什么有时候网页访问连接失败，但QQ能够连上？A：QQ直接使用IP地址连接服务器，而网络用的是DNSTCP/IP协议族TCP/IP 是互联网相关的各类协议族的总称，按层次分别分：应用层、传输层、网络层和数据链路层接收端的服务器在链路层接收到数据，按序往上层发送，一直到应用层。当传输到应用层，才能算真正接收到由客户端发送过来的 HTTP请求发送端在层与层之间传输数据时，每经过一层时必定会被打上一个该层所属的首部信息。反之，接收端在层与层传输数据时，每经过一层时会原创 2021-02-24 10:12:45 · 844 阅读 · 0 评论 -
判断移动端所处浏览器环境：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 · 486 阅读 · 0 评论 -
安卓+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 · 2311 阅读 · 0 评论 -
CSS的优化原理
浏览器加载过程reflow（回流）：当浏览器发现某个部分发生了点变化影响了布局，需要倒回去重新渲染，内行称这个回退的过程叫 reflow。reflow 会从 这个 root frame 开始递归往下，依次计算所有的结点几何尺寸和位置。reflow 几乎是无法避免的。现在界面上流行的一些效果，比如树状目录的折叠、展开（实质上是元素的显 示与隐藏）等，都将引起浏览器的 reflow。鼠标滑过、点击……只要这些行为引起了页面上某些元素的占位面积、定位方式、边距等属性的变化，都会引起它内部、周围甚至整个页原创 2021-02-08 16:37:53 · 153 阅读 · 0 评论