Cang_Ye的博客

Git Submodule 是管理复杂项目的重要工具，通过合理使用可显著提升开发效率。掌握其核心原理和操作流程后，开发者能更优雅地处理代码复用、模块化开发和团队协作问题。建议结合实际项目需求，灵活运用本文提供的方法，打造高效的代码管理体系。

IntersectionObserver API 来检测元素是否进入或离开视口，从而实现懒加载、无限滚动、触发动画等效果。下面简单介绍几种常见的应用场景和使用方式：

通过合理运用IntersectionObserver，开发者可以显著提升网页性能表现。本文封装的createObserver函数已在生产环境验证，支持日均百万级PV场景，成功将滚动相关性能损耗降低约65%。建议根据实际需求调整配置参数，平衡性能与用户体验。IntersectionObserver通过异步回调机制，提供高效的元素观察能力，性能提升可达300%（基于Google案例测试数据）。

前端包管理工具进化论：npm vs yarn vs pnpm 深度对比

vue自定义组件双向数据绑定。

FileUpload},methods: {// 在这里处理文件上传，比如发送到服务器console.log('开始上传文件:', file);

接口返回文件流需要对返回的数据类型进行指定，在Axios请求里传递参数 {responseType: ‘blob’},这样接口返回的数据类型就会变成 blob 格式。方便后续处理接口返回的文件数据。通过响应头中是否存在 Content-Disposition 判断返回的数据是不是文件流。如果不是文件流就当成普通接口处理。同时在 axios 的响应拦截函数里面通过 responseType === ’blob‘ 判断是否返回响应头的数据。通过 FileReader() 转化 blob 为对象格式。

nextTick实现原理

到达第 i 阶楼梯的方法数是到达第 i-1 阶和第 i-2 阶楼梯的方法数之和。这是因为，要到达第 i 阶，你最后一步要么是从第 i-1 阶上来的，要么是从第 i-2 阶上来的。

在web项目中引入官方库 uni.webview.1.5.4.js ，

iframe碎片实现web界面局部打印。解决了拉起打印机内容为空；解决了拉起打印机样式丢失；

现代Web开发中的跨标签页通信是一个多样化且复杂的话题。通过结合LocalStorage、Broadcast Channel API、SharedWorker、postMessage以及Cookie，开发者可以选择适合自己应用场景的最佳方案。理解这些技术的优势和局限性对于设计一个高效、安全且用户友好的Web应用至关重要。

在合成阶段（在绘制阶段之后，如 WidgetsBinding.drawFrame 中所述）合成此小部件时，它会应用一个转换，将链接的 CompositedTransformTarget 的 targetAnchor 和此小部件的 followerAnchor 结合在一起。如果父级覆盖屏幕，这很容易实现，所以这个小部件通常用作应用程序范围的 Overlay 中的 OverlayEntry 的根（例如，由 MaterialApp 小部件的导航器创建）。例如：功能引导，跟随弹窗等功能。

我们拿到控件生成的 ByteData，通过 ByteData.buffer.asUint8List() 拿到 Uint8List ，然后通过 RenderRepaintBoundary 中的 toImage() API 来获取当前控件生成的 ByteData。上面我们已经拿到了，生成 png 文件了，下面的就直接根据 fluwx 的文档直接去用就可以了。之后获取临时的缓存目录，File().create() 创建 一个空间的 png File。想要仔细了解 image_gallery_saver 点。

但是在 Flutter 项目中使用微信开放标签拉起 APP 会跳转进一个 native 白屏界面，只有你返回的时候才会返回到 flutter 的 页面，这就非常的奇奇怪怪。大家应该都知道在微信浏览器里面是无法直接拉起 APP 的，需要对接微信的开放标签 （wx-open-launch-app） 拉起 APP。我把这个example 的配置全部拿到新建的空白项目中后，就不会在跳到 native 的白屏界面。一开始怀疑是项目代码有问题，倒是我哪怕是新建一个空白的项目去拉起还是白屏，这就比较难搞了。

手写极简MVVM实现了 {{}} 模板数据解析v-click事件c-mode指令

path 模块是 node.js 的内置模块，而 node.js 默认不支持 ts 文件的，所以需要安装 @type/node 依赖包。的时候才不会提示是否安装你。根据需要进行配置路径别名。

el-tabale 多选添加 分页 默认选中1. 子组件 `initData` 初始化获取数据之后 通过 `this.$nexttick(()=>{})` 对 `el-table` 进行默认选中。当前选中的项 包括三部分 ：2. 需要吧这三项进行合并去重，存储到 `currentSelect` . 然后根据 `el-table` 当前页的数据 过滤后 默认选中。默认选中会刷新 `selectionGoodsList` 为当前页面选中的数据。3. 确认选中的时候 就更新所有的选中项 `currentSe

2022 年 6 月 22 日，第 123 届 ECMA 大会批准了 ECMAScript 2022 语言规范，这意味着它现在正式成为标准。

Vue-H5 微信公众号静默授权。从注册测试号到进行授权。目前仅支持微信浏览器内部进行授权，还没有在其他浏览器进行授权的逻辑。公众号授权进行开发调试的时候需要微信浏览器访问访问电脑端开启的项目服务，之后会讲手机怎么访问电脑开启的项目服务。...

一、 业务逻辑使用el-table的自定义列功能，同一行数据的两列有互动，当一列（值来源）数据改变，另一列（默认值）的el-select无法选中值（实际v-model对应的数据已改变，但是页面上没有更新），如图：二、原因默认值这一列对应的select的v-model对应的字段是在table生成后动态插入的，初始的数据结构类似：//data 为el-table的datavar data=[ {src:'param'}]src字段改变后，在值来源的select的chan..

web缓存：数据库缓存，服务器缓存，浏览器缓存；浏览器缓存：indexDB localStorage(5M);sessiStorage(5M);Cookie(4K) HTTP缓存HTTP缓存：强缓存(expries Cache-Contral) 协商缓存(Etag:if-none-match Last-Modifiy:if-Modify-Since)浏览器第一次请求浏览器再次请求：为什么已经有了Last-Modifiy 还需要ETag ？1. Last-Modified.

插件插件是自包含的代码，通常向 Vue 添加全局级功能。它可以是公开install()方法的object（ { install:xxxx } ），也可以是function1、编写插件每当这个 插件 被添加到应用程序中时，如果它是一个对象，就会调用对象中的install方法。如果它是一个function，则函数本身将被调用。两种情况调用的函数都会接受两个参数：Vue.creatApp生成的对象和自己填写的options；差劲最好单独在一个文件中编写 暴...

vue项目对部分DOM进行打印通过$ref 获取需要打印的DOM注册自定义全局方法$printimport Print from '@/common/print.js' // 引入附件的js文件Vue.use(Print) // 注册print.jsprint.js// 打印类属性、方法定义/* eslint-disable */const Print = function (dom, printType, options) { if (!(thi.

其实没什么东西就是添加一个自定义指令，就是在dialog的头部的时候，添加一个onmousedown 事件，获取当前鼠标的位置 然后更新dialog的定位位置；copy可用： bind(el, binding, vnode) { const dialogHeaderEl = el.querySelector('.el-dialog__header') const dragDom = el.querySelector('.el-dialog') dialogHeade.

设置自定义指令实现 一些通用的功能，样式等Example ：（文档上的）<div id="dynamicexample"> <h3>Scroll down inside this section ↓</h3> <p v-pin:[direction]="200">I am pinned onto the page at 200px to the left.</p></div>const app = Vue.c

！！首先安装 vuedraggable npm i -S vuedraggable@next一定要带上@next，不然就会报错 很恶心！使用建议看官网。官网：vue.draggable中文文档 - itxst.comVue.Draggable是一款基于Sortable.js实现的vue拖拽插件。支持移动设备、拖拽和选择文本、智能滚动，可以在不同列表间拖拽、不依赖jQuery为基础、vue 2过渡动画兼容、支持撤销操作，总之是一款非常优秀的vue拖拽组件。https://www.itxs..

先上图看效果：SQL格式化使用的是 codemirror 和 sql-formatter 实现的（建议看文档搞）使用就直接用就可以了，如果用的地方多建议 install 全局组件 <codeEditor v-model:value="code" :scene="type" :height-size="200" ></codeEditor>对富文本编辑器进行封装。直接copy可用<templat...

Upload 上传文件设置参数和请求

index.ts 用来暴露实例import EnclosureHttp from "@/utils/http/requset";const http = new EnclosureHttp();export default http;request.ts 实现 axios 创建实例 请求拦截 响应拦截 和默认 的get post 封装（偷懒了，没有封装自定义的 get post put delete ）import Axios, { AxiosRequestConfig, A.

Record<K,T>;将petsGroup中的每个值(‘dog’ | ‘cat’ | ‘fish’)都转为 IPetInfo 类型。当然也可以自己在第一个参数后追加额外的值，type petsGroup = 'dog' | 'cat' | 'fish';interface IPetInfo { name:string, age:number,}type IPets = Record<petsGroup, IPetInfo>;const anim...

一、比较恶心的算法逻辑：因为对链表不了解，所以我最开始想到的是 类似两个数组相加；把两个链表遍历成数组然后倒过来转换成数字，相加后再反转数组；比如：arr1 = [2,8,6] ;arr2= [9,5,2] 把两个数组 reverse() 之后 join() 一下不就能得到 '682' 和 '259'了吗！Number() 之后 在相加 这不就得到 707 吗！ 最后就是 split() 一...

MVVM 匹配 {{}}

// promise手写 /* 1.promise状态 pending（等待） resolve（成功） reject（失败） 2. resolve 和 reject 函数 3. then方法的实现 4.发布订阅者模式 实现异步 5.链式调用 ( 返回 普通值 和 promise) 6.resolve reject all race c...

//引入核心模块const http = require("http");const https = require("https");const fs = require("fs");const cheerio = require("cheerio");for (var page = 1; page < 2; page++) {}// let url = `https://pic.netbian.com/4kdongman/index_${page}.html`for (let .

将输入的变量名转换为小驼峰写法可能的输入命名格式如下：TestVariabletest_variableTEST_VARIABLE，最终输出为testVariablefunction format( name ) { // write code here if(name == "") return name if(name.indexOf('_') != -1){ name = name.toLowerCase() } l

给定一个先序遍历与中序遍历的二叉树，要求求出该二叉树的后序遍历表示形式。对于如下二叉树：其先序遍历为：GDAFEMHZ其中序遍历为：ADEFGHMZ当给定先序遍历与中序遍历时，该二叉树就被唯一的确定下来，这时即可求出二叉树的后序表示为：AEFDHZMG。给定输入中，二叉树中的字符有且仅有一个，且二叉树中的所有节点互不相同输入：两行，第一行为二叉树的先序遍历表示，第二行为二叉树的中序遍历表示输出：一行，二叉树的后续遍历表示function binaryTre.

PRINT_INT(strPrintTaskName)打印初始化● SET_PRINT_PAGESIZE(intOrient,intPageWidth,intPageHeight,strPageName)设定纸张大小● ADD_PRINT_HTM(intTop,intLeft,intWidth,intHeight,strHtml)增加超文本项● ADD_PRINT_TEXT(intTop,intLeft,intWidth,intHeight,strContent)增加纯文本项● ADD_..

function exportMethod(data) { let token = Vue.cookie.get('token') // 请求头带上token axios.defaults.headers.common["token"] = token; axios({ method: data.method, url: `${data.url}${data.params ? '?' + data.params : ''}`, responseType: 'blob'.

## 简单实现两点连线文档地址：uni-app官网## 代码<template> <view> <map style="width: 100%;height: 600rpx;" :latitude="latitude" :polyline="polyline" :include-points="includePoints" :longitude="longitude" :markers="markers"></map>...