- 博客(27)
- 收藏
- 关注
RSS订阅原创 前端面试知识点大全（带答案）
BFC（Block Formatting Context，块级格式化上下文）是一个独立的渲染区域，内部元素的布局不会影响外部。根元素 htmlfloat 不为 noneposition 为 absolute 或 fixeddisplay 为 inline-block、flex、grid、table-cell 等overflow 不为 visible（如 hidden、auto、scroll）① 清除浮动（父元素 overflow: hidden）；
2026-08-26 09:41:40
202
原创 ES6 数组遍历与去重最全详解（开发必备）
在ES6之前，我们处理数组仅能使用forforEachfor...in几种方式，存在功能单一、无法中断遍历、对象数组去重繁琐等问题。ES6 新增for...offindfindIndexsomeeveryfilter等遍历API，搭配 Set、Map 结构，能够覆盖开发中99%的数组处理场景。
2026-08-24 21:26:46
161
原创 Lodash-es 核心知识汇总
核心价值：Lodash-es 是 CRM 开发的 “效率神器”，简化数据处理、防抖节流、深拷贝等高频场景，代码更简洁健壮；使用原则按需引入（避免包体积过大）；防抖 / 节流函数需保存实例，避免重复创建；简单操作（如数组 filter）用原生，复杂操作（如深拷贝、分组）用 Lodash；高频函数cloneDeepgetorderBygroupByuniqBy；避坑核心防抖 / 节流函数避免重复创建；
2026-05-29 08:49:27
412
原创 web-storage-cache 核心知识汇总（Vue3 + CRM 本地存储实战）
封装统一工具：所有本地存储通过封装的操作，统一处理加密、过期、命名空间；场景化存储策略永久数据（用户偏好）：localStorage + 无过期；临时数据（筛选条件 / 表单）：sessionStorage + 短期过期；敏感数据（Token / 手机号）：加密存储 + 合理过期；字典数据：批量缓存 + 1 天过期（减少接口请求）；容错与降级：处理浏览器禁用存储、大数据存储异常等场景，避免页面崩溃；性能优化避免缓存超大数据，优先后端分页；定期清理过期缓存，减少存储占用；
2026-05-29 08:48:47
396
原创 NProgress 核心知识汇总（Vue3 + CRM 加载进度条实战）
监听进度条状态变化，执行自定义逻辑：typescript运行// 监听进度条开始console.log('进度条启动');// 禁用页面滚动（可选）});// 监听进度条结束console.log('进度条结束');// 恢复页面滚动});封装统一工具：将 NProgress 封装为全局工具函数，统一配置和样式，避免重复代码；场景适配路由跳转：全局路由拦截，延迟结束进度条；接口请求：Axios 拦截器计数，批量请求合并进度；
2026-05-28 08:22:53
324
原创 Cropper.js 核心知识汇总（图片裁剪实战）
支持用户自由裁剪（aspectRatio = NaN），适用于物料图片 / 二维码：vue/>组件化封装：将裁剪逻辑封装为通用组件，支持自定义比例 / 尺寸，适配所有图片裁剪场景；性能优化图片先压缩后裁剪，减小上传体积；跨域图片添加属性，避免裁剪报错；移动端适配触摸操作，提升交互体验；场景适配头像 / 证件照：1:1 比例，固定尺寸；合同 / 文档：A4 比例（21:29.7）；物料 / 二维码：无固定比例，自由裁剪；避坑核心图片加载完成后再初始化裁剪器；
2026-05-28 08:21:41
402
原创 CryptoJS 核心知识汇总
封装统一工具：将加密逻辑封装为全局工具函数，避免重复代码，统一密钥 / 算法配置；按需选择算法本地存储 / 参数加密：用 AES 对称加密；密码 / 签名：用 MD5/SHA256 哈希（不可逆）；接口防篡改：用 HMAC-SHA256 带密钥签名；安全注意事项密钥不要硬编码，优先从环境变量 / 后端接口获取；核心接口必须签名 + 时间戳 + 随机数，防止重放攻击；本地存储敏感数据必须加密，避免 XSS 泄露；前后端对齐统一加密算法、模式、填充方式、编码格式；
2026-05-27 09:19:49
300
原创 Vue I18n
适用场景需多语言支持的跨境 CRM、多语言团队协作场景；纯中文 CRM 无需引入 Vue I18n，完全没必要；核心配置按模块拆分语言包（common/customer/order），便于维护；语言切换后保存到本地存储，刷新不丢失；性能优化大型 CRM 按需加载语言包，缓存翻译结果；自定义缺失翻译兜底，避免页面显示空白；集成第三方组件同步 Element Plus 等第三方组件的多语言，保证体验一致。
2026-05-27 09:19:16
350
原创 VueTypes 核心知识汇总
custom使用场景纯 JS 项目：用 VueTypes 做运行时 props 校验；TS 项目：用 VueTypes 补充运行时校验（TS 仅编译时），尤其复杂对象 / 自定义规则；团队协作：统一 props 校验规范，降低沟通成本。最佳写法简单 props：用 TS 原生注解（如复杂 props：用结合 TS 接口，兼顾静态 + 运行时校验；全局复用：封装通用类型（如 CustomerType/OrderType），避免重复定义。避坑核心。
2026-05-17 15:17:53
424
原创 Day.js 核心知识汇总
封装工具函数：将日期格式化、时间范围、相对时间等封装为全局工具函数，避免重复代码；按需引入插件：仅引入项目需要的插件（如 relativeTime、timezone），减小打包体积；统一日期格式：CRM 中约定前后端日期传输格式为，避免格式混乱；结合 Pinia 使用：统计类的时间范围（如 “本月”“近 7 天”）可存在 Pinia 中，多组件共享；避坑核心：注意月份从 0 开始、空值处理、时区转换，这些是 CRM 日期处理最易出错的点。
2026-05-17 15:15:56
354
原创 QRCode 核心知识汇总
CRM 客户详情页生成客户名片二维码，包含姓名、电话、公司等信息，自定义颜色适配品牌：vue<template>:color="{ dark: '#1890ff', light: '#f5f5f5' }" // 蓝色二维码，浅灰背景/></div>// 二维码内容：客户信息JSON（后端可解析）source: 'CRM系统'});});</script>组件化封装：将二维码生成逻辑封装为通用组件，避免重复代码；按需选择渲染方式仅展示：用toCanvas（性能最优）；
2026-05-01 13:10:03
309
原创 Vue Router 核心知识汇总
表格工具核心职责协同方式Vue Router页面跳转、路由传参、权限控制1. 动态路由传参给组件（如 orderId）；2. 路由参数传递筛选条件；3. 守卫控制页面访问权限Pinia全局数据存储、异步请求封装1. 组件从 Pinia 读取数据；2. Action 封装请求逻辑；3. 权限判断依赖 Pinia 的用户状态缓存组件激活时刷新数据1. 返回列表页时触发刷新；2. 刷新逻辑同步路由参数和 Pinia 数据核心组合。
2026-05-01 13:09:23
423
1
原创 Vue3 + CRM 项目中 Axios/Pinia/Mitt/qs 合理使用指南
一句话总结：Pinia 管 “存数据”，Axios 管 “拿数据”，Mitt 管 “传消息”，qs 管 “调格式”—— 各司其职，不越界。代码落地（关键片段）typescript运行场景 3：全局加载状态（Pinia + Axios 配合）CRM 中常需要全局加载状态（如按钮加载、页面加载），用 Pinia 存储，Axios 拦截器自动更新：typescript运行三、避坑指南（新手最容易错的点）1. 不要用 Mitt 传递需要持久化的数据❌ 错误：用 Mitt 传递用户信息、订单数据（页面刷新就丢）；
2026-04-23 08:49:21
27
原创 Pinia 核心知识汇总
2. 前置准备bash运行3. 全局注册（src/main.ts）typescript运行二、基础用法（快速上手）Pinia 核心是「Store」（仓库），每个 Store 对应一个业务模块（比如用户、订单、全局配置），CRM 中最常用的是「用户 Store」（存储 token、用户信息）。核心用法：用 defineStore 创建 Store，内部分「状态（ref）、计算属性（computed）、方法（async/await）」；// 获取订单列表（Action 中封装异步逻辑）存储全局数据（非响应式）
2026-04-23 08:48:15
43
原创 Axios 核心知识汇总
基础用法是核心，GET 用params传参，POST 用data传参；封装核心：通过请求 / 响应拦截器统一处理 token、错误、加载状态，简化组件调用；CRM 实战：按业务模块拆分接口（order/customer/record），配合 Pinia 管理 token，拦截器处理 401 跳转登录；高级技巧：取消重复请求（解决快速点击）、上传文件（配置 multipart/form-data）是 CRM 开发的高频需求。绝大多数场景下，Axios 自带的参数拼接完全够用，无需额外用 qs；
2026-04-13 21:08:13
459
原创 mitt.ts 核心知识汇总
核心定位：mitt.ts 是前端全局事件总线，专注“一次性动作通知”，不存储数据，与 Pinia 互补；核心用法on（监听）、once（监听一次）、emit（触发）、off（取消监听），封装后需关注类型约束和内存泄漏；使用原则：仅用于无数据存储的即时通知，数据共享优先用 Pinia，避免用状态管理替代事件通知。
2026-04-13 21:06:34
237
原创 Sass（也常写作 SCSS）：前端开发中最常用的 CSS 预处理器
Sass（SCSS）核心价值是提升 CSS 可维护性：变量解决重复值、嵌套简化层级、混合器 / 继承复用代码、导入实现模块化；工程化项目中只需安装sass依赖，即可直接使用.scss文件；$变量{}嵌套（& 代表父选择器）、混合器、@extend继承、导入。如果你的项目是特定框架（比如 React + Webpack、Vue2），或者想了解 Sass 的高级用法（如函数、条件判断），可以告诉我，我会针对性补充。
2026-04-11 19:08:39
230
原创 qs 是前端 / Node.js 中处理 URL 查询参数的常用库
如果项目中需要统一的查询参数处理规则，可以封装成工具函数：typescript运行// qs.ts - 自定义工具类/*** 通用查询参数转字符串（预设常用配置）* @param params 要转换的参数对象* @returns 编码后的查询字符串*/arrayFormat: 'repeat', // 数组用重复key（如hobbies=篮球&hobbies=游戏）encode: true, // 开启URL编码（处理中文/特殊字符）
2026-04-11 19:08:08
62
原创 TypeScript 全知识 + 实战技巧汇总（Vue3 开发必备）
基础层：类型注解 / 推断、接口 / 类型别名、枚举，是 TS 入门的核心；进阶层：泛型、类型守卫、类型操作符，是 Vue3 复杂场景的必备；实战层：Vue 组件 Props/Emits、Pinia、请求层的类型约束，是落地 TS 的关键；原则严格模式必开（），最大化 TS 价值；能推断不注解，不能推断必注解；优先用接口描述对象，类型别名描述联合 / 交叉类型；避免滥用 any，用 unknown + 类型守卫替代。
2026-04-07 09:08:20
266
原创 ES6 (ES2015) 全知识
变量 / 解构 / 模板字符串：简化基础数据操作，是日常开发的 “语法糖”；箭头函数 / 扩展运算符：大幅减少代码量，Vue 组件 / 数据处理高频用；class / 模块化：工程化开发的核心，封装通用逻辑、拆分代码模块；Promise：异步编程基础，是 async/await（ES2017）的前置；实战原则：优先用 const/let、箭头函数简化回调、模块化拆分代码、class 封装通用逻辑。
2026-04-01 22:48:52
350
原创 JavaScript 面向对象（OOP）核心总结（面试 + 实战必背）
OOP 不是 “写 class”，是 “封装 / 继承 / 多态” 思想：Vue3 + TS 中，OOP 是 “底层工具”，而非 “组件写法”；核心使用场景封装通用模块（请求、验证、工具类）；复杂业务逻辑封装（如客户 / 订单管理）；TS 接口 + 类实现类型约束；取舍原则组件层面：用组合式 API，不写 class 组件；逻辑层面：复杂逻辑封装成类，简单逻辑写函数；复用层面：函数式（useXXX）解决组件逻辑复用，OOP 解决通用模块复用。
2026-04-01 10:16:30
308
原创 jQuery 核心知识汇总
角色定位：jQuery 在 Vue3 + CRM 中是 “兼容工具”，而非 “主力工具”—— 新开发不用，老系统 / 插件兼容时用；核心用法：DOM 操作、事件委托、AJAX 是 jQuery 最核心的价值，也是老 CRM 系统维护的重点；替代方案：Vue3 + Lodash-es + axios 可完全替代 jQuery 的所有功能，且更符合现代前端开发范式；兼容原则jQuery 与 Vue3 共存时，避免互相修改对方的 DOM / 数据；局部引入 jQuery，避免全局污染；
2026-03-31 21:49:45
396
原创 JavaScript BOM & DOM 核心知识汇总
核心区别：DOM 操作页面元素，BOM 控制浏览器行为，window是顶级对象；DOM 最佳实践Vue3 中优先用响应式，仅第三方库 / 特殊场景操作 DOM；批量操作用减少重绘；列表交互用事件委托，减少事件绑定；避免innerHTML，防止 XSS 攻击；BOM 高频用法location：解析 URL 参数、页面跳转；：本地存储（封装容错）；navigator：检测设备 / 浏览器，适配 CRM 移动端；定时器 / 事件：及时清理，避免内存泄漏；CRM 核心原则。
2026-03-31 21:49:10
390
原创 小程序项目总结
总体思路总结如下: 1 获取用户输入的内容,尽量用bindinput ,验证的时候最好使用bindblur;2 数据分页加载的功能,其实是声名一个空数组,这个空数组carlist就是页面的数据列表,每次请求到的数据,利用数组的concat()方式将新请求到的数据跟之前的数组链接起来,形成分页加载的效果,如果请求的数据是空,则显示到底了,如果第一次请求数据就是空,则显示时暂无数据; 这样不以依据...
2018-06-05 10:38:46
2661
前开发基于TyeScript的静类型系统构建：面向Vue/React框架的类型安全与工程化实践方案设计
2025-12-05
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人