配件：
太阳能充电板*1、充电模块*1、18650电池*1、10kΩ*3、NPN三极管(S8050)*1、光敏电阻*1、发光二极管*1、导线若干
电路图：
实物模拟图：
为电路添加充电模块：
原理：[……]
作者：SKILLNULL
env(safe-area-inset-bottom) 兼容写法
先看下兼容性：
可以看到 @supports 兼容性很好，所以使用 @supports 做兼容是个不错的选择。
例：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
@supports (padding-bottom: env(safe-area-inset-bottom)) or (padding-bottom: constant(safe-area-inset-bottom)) { .your-dom { padding-bottom: constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */ padding-bottom: env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */ } } @supports not (padding-bottom: env(safe-area-inset-bottom)) { .you-dom { padding-bottom: 20px; /* 根据实际情况设定兜底距离 */ } } |
缩放实现0.5px
禁止 IOS 橡皮筋效果
首先，在拖动 div 时，判断当前容器 div 是否有滚动条，如果没有，则禁止整个 div 拖动，例：
|
1 2 3 4 5 6 |
const list_dom: any = document.querySelector(".list"); list_dom.addEventListener("touchmove",(ev) => { if (list_dom.scrollHeight <= list_dom.clientHeight &&list_dom.offsetHeight <= list_dom.clientHeight) { ev.preventDefault(); } },{ passive: false }); |
注：上述方法仅适用于 div 内没有其他内容滚动情形！如果内层有其他 div 滚动，则[……]
JS 拦截浏览器返回
海康威视DS-IPC-E42H-IWPT监控画面竖线处理
Echarts 5 动态按需引入图表
React 18 自定义 Hook 获取 useState 最新值
原理：通过同步更新 useRef 来获取最新值
|
1 2 3 4 5 6 7 8 9 10 11 |
// util.ts export const useRefState = (init: any = null) => { const [state, setState] = useState(init); const stateRef = useRef(init); const setProxy = (newVal: any) => { stateRef.current = newVal; setState(newVal); }; const getState = () => stateRef.current; return [state, setProxy, getState]; }; |
使用：
|
1 2 3 4 5 6 7 |
import { useRefState } from "util" const [state, setState, getState] = useRefState(0) state // state 值，变动后更新DOM setState // setState，变动 state getState() // 获取最新值 |
处理报错 ResizeObserver loop completed with undelivered notifications.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
// 处理报错 ResizeObserver loop completed with undelivered notifications. export const handlerResizeObserverError = () => { const debounce = (callback: (...args: any[]) => void, delay: number) => { let tid: any; return function (...args: any[]) { const ctx = self; tid && clearTimeout(tid); tid = setTimeout(() => { callback.apply(ctx, args) }, delay) } } const _ = (window as any).ResizeObserver; (window as any).ResizeObserver = class ResizeObserver extends _ { constructor(callback: (...args: any[]) => void) { callback = debounce(callback, 20) super(callback) } } } |
Mac版Sublime Text 4152 激活
- Sublime Text下载地址：Download – Sublime Text
- 破解工具“Hex Fiend”下载地址：Hex Fiend, a fast and clever hex editor for macOS
- 打开Hex Fiend -> File ->[……]