Houser Houserqu

滚动吸顶的 js 实现

  useEffect(() => {
    const handle = () => {
      const top = document.documentElement.scrollTop || document.body.scrollTop
      setTabFixed((value: boolean) => {
        console.log(top, value, safeArea().top)
        if (top > headerRef.current?.clientHeight) {
          console.log('set fixed')
 return true

html 标签转义

value = value.replace(/&/g, "&amp;");
value = value.replace(/</g, "&lt;");
value = value.replace(/>/g, "&gt;");
value = value.replace(/ /g, "&nbsp;");
value = value.replace(/"/g, '&quot;');

思路：将真实图片地址先放在 data-src 属性上，当图片出现在可视区域当时候，再将 data-src 属性值设置到 src 属性上，触发下载图片。判断是否在可视区域，可以用元素的 getBoundingClientRect 方法（参考）

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

防抖

/**
 * 防抖：连续执行的函数，只有超过指定间隔时间才会真正执行
 * 防抖函数工厂方法，返回具有防抖功能的函数
 * @param fn 需要包装防抖功能的方法
 * @param delay 重置时间
 */
function debounce(fn, delay) {

encodeURIComponent()

function RFC3986UrlEncode(str){
  return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16).toUpperCase();
  });
}

	func DownloadFile(url string) (localPath string, err error) {
	resp, err := http.Get(url)
	if err != nil {
	panic(err)
	}
	defer resp.Body.Close()

	filename := filepath.Base(url)
	localPath = "bg/" + filename

	import * as archiver from 'archiver';
	import * as fs from 'fs'
	import * as unzipper from 'unzipper'

	/**
	* 根据目录压缩 zip 文件
	* @param filePath
	* @param folderPath
	* @returns
	*/

	import { useEffect, useRef } from "react"
	import * as monaco from 'monaco-editor'

	interface Props {
	defaultValue?: string
	height?: number
	onChange?: any
	}

	export default function Editor({defaultValue, height = 500, onChange}: Props) {

	// 不同的算法要求的 key 长度不一样
	// 算法 key iv
	// 128 16 16
	// 192 24 16
	// 256 32 16
	// 示例 key d42308a3a6f9db4e6eeff373e1b34663 iv 8109f3a93716beab

	/**
	* aes 加密封装
	* @param data

	/**
	* 相对时间校验
	* @param property [数量，时间单位]，时间单位参考 dayjs，例如 1 年前，[1, 'year']
	* @param validationOptions
	* @returns
	*/
	const IsRelativeDate = function (property: [number, string], validationOptions?: ValidationOptions) {
	return function (object: Object, propertyName: string) {
	registerDecorator({
	name: 'IsRelativeDate',