- 博客(38)
- 收藏
- 关注
原创 我得vscode左下角总是会出现向上箭头的推送内容 如何查看我要推送上去的信息
你运行的命令是:branch是我的分支名这条命令的作用是:显示当前分支相对于远程分支之间的提交差异(只显示在本地但远程没有的提交)。
2025-07-28 14:42:17
195
原创 react和vue的综合面试题
在 React 中的表现,相当于 Vue 生命周期中的多个阶段,具体取决于你怎么使用它。我们可以根据不同用法来精确对应:✅ 一张对照表: 对应 Vue 生命周期📌 对应示例解释等同于: ⟶ 相当于 Vue 的 等价于 Vue 的: ⟶ 相当于 Vue 的 等价于:(无依赖) ⟶ 类似 每次渲染都会执行一次:Vue 中:总结一句话:✅ Vue2、Vue3、React 组件通信方法总览✅ 2. $emit(子传父)✅ 3. EventBus(兄弟通信)
2025-07-16 09:35:13
941
原创 引入了模块但没有使用”,会不会被打包进去
引入方式会被打包?说明❌ 不会没使用的 ES Module 会被 tree-shake 掉⚠️ 可能如果模块有副作用,就会被保留✅ 会明确执行副作用代码,必被保留✅ 会CommonJS 无法摇树,几乎都被打进去这个问题问得非常好!我们来用Webpack/Vite 的打包逻辑 + 生活类比副作用 = 模块一引入,就会自动执行代码,比如:给全局对象加属性输出 console注入 CSS 样式注册事件设置全局 polyfill写法Webpack怎么理解会被移除吗引入模块内部的变量或函数。
2025-07-12 15:15:49
1017
原创 在前端项目中是如何解决跨域的
Webpack 和 Vite 都通过“本地开发服务器代理”的方式解决跨域,本质一致,但 Vite 配置更简单,开发体验更好。
2025-07-11 10:26:14
915
原创 React封装过哪些组件-下拉选择器和弹窗表单
组件对外暴露弹窗控制器(Context 模式)❗难点在于:如何在父组件中控制子组件内部的 Modal 行为采用 React 的useContext创建全局控制器;内部封装了方法,供外部调用;父组件通过获取控制器,实现跨组件通信;解耦了弹窗的触发逻辑,使组件更灵活、可扩展。👉适用于复杂业务流程、URL 参数触发弹窗、全局快捷操作等场景。封装组件时,借助 React 的 Context 机制,把内部的控制方法(如打开弹窗)暴露出去,让外部组件也能调用它。
2025-07-10 13:04:41
981
原创 浏览器的兼容性
不同浏览器(如 IE、Chrome、Safari)在对 HTML/CSS/JS 的支持程度不同,尤其老版本 IE、安卓 UC 浏览器等,常常存在渲染/语法/行为差异,必须做兼容性处理,提升用户体验。“我在项目中非常关注兼容性问题,前端工程统一使用 Babel + Polyfill 保证语法兼容性,CSS 通过 autoprefixer 自动加前缀,处理过如vh高度不准确、sticky 不生效等问题,也针对移动端键盘遮挡等细节做过优化。
2025-07-10 11:28:47
942
原创 项目难点和亮点 打包发布的组件
4. **构建状态展示**:使用 React + `useState` 实时更新每个平台的构建状态,如“成功”、“超时”、“失败”,**提供良好的用户可视化体验**。1. **并发构建**:使用 `Promise.allSettled()` 实现多个平台的构建请求并发发送,**保证即使某个平台失败也不会影响整体流程**。* 对于构建失败的平台,我将状态标记为 ❌ 并提供 **“重试”按钮**,由用户手动触发重试;### **A(Action)我采取的行动:**### **T(Task)我的任务:**
2025-07-09 13:04:51
363
原创 导航栏的可访问性(Accessibility) 项目难点亮点
问题:菜单收起逻辑依赖「子菜单最后一个元素失焦后跳转到下一个主菜单」,但是在实际开发中,blur和focusout事件行为细节复杂,容易误判。技术难点blur不会冒泡,只能监听单个元素;focusout会冒泡,但可能会在用户点击子元素时被错误触发;同时需要避免「快速 tab 切换」导致焦点跳转逻辑失效。🎯“为了保证无障碍体验,我在主菜单中使用focusout冒泡事件监听子菜单的焦点离开情况,结合setTimeout延迟判断是否真的是“全部失焦”,避免用户在子菜单之间快速切换时误触发逻辑。
2025-07-09 11:35:29
365
原创 经典面试题:为什么 React 需要 Fiber 架构,而 Vue 没有类似 Fiber 的机制?
为什么 React 需要 Fiber 架构,而 Vue 没有类似 Fiber 的机制?
2025-07-04 17:37:45
221
原创 blur和focusout(项目中实现导航accessibility的功能的总结)
之前做过一个需求 有一个导航 大概要实现以下内容开启mac的旁白设置,同级菜单之间可使用键盘(如 Tab / Shift+Tab)切换;点击某个菜单 icon 展开子菜单;子菜单的最后一个元素失焦时,自动跳转焦点到下一个主菜单。
2025-06-28 16:33:32
160
原创 Webpack Vite面试题
对比项LoaderPlugin目的处理单个文件类型(模块转换)拓展 Webpack 功能(构建流程钩子)关注点是对文件的转化操作(预处理)是对整个打包流程的扩展操作用法中配置plugins数组中实例化使用常见示例css-loader编写思路一、什么是文件指纹?文件指纹是指在打包输出的文件名中添加一段Hash 值后缀,用于实现浏览器缓存优化。app.8ef3adf2.js // 带 hash 的文件名好处是:当源代码发生变更时,文件名会变,从而让浏览器重新请求新文件,
2025-06-20 11:20:13
407
原创 mac安装nvm
这一步用的是清华大学的镜像服务器,可以直接访问,无需翻墙。✅ 第五步:安装 Node.js(LTS版本)然后配置 NVM 的环境变量(添加到。你使用的是 Zsh,编辑。如果显示版本号,则成功!
2025-06-03 21:42:20
1185
原创 sass less css
项目CSSSassLESS类型样式语言CSS 预处理器CSS 预处理器原理直接由浏览器解析编译成 CSS 后使用编译成 CSS 后使用本质静态语言动态样式语言动态样式语言结论内容新项目建议推荐使用Sass(SCSS),功能更强大,社区支持好,兼容主流构建工具(如 Vite/Webpack)老项目兼容如果已有项目用了 LESS,可以继续用,不必强制迁移个人偏好如果追求更清晰的结构和强逻辑控制,选 Sass;如果只想快速增强 CSS,LESS 也不错?
2025-04-24 21:31:58
589
原创 css的三种布局 流体布局 圣杯布局 双飞翼布局
大致思路:使用全体浮动 相对定位 和margin-left进行布局。中间内容前置——> 重要内容可以放在文档流前面优先渲染。三列布局 两边内容定宽 中间内容前置且宽度自适应。
2025-04-15 21:39:12
159
原创 多个commit合并成一个(Git 交互式变基(rebase))
键盘点击i进入编辑模式 将除了第一条外的其他pick改成squash 然后esc+:wq退出i 删除不必要的提交信息 esc :wq最后强制提交:git push --force。
2025-04-09 23:05:43
878
原创 package.json详解
管理本地npm安装包的方法是创建一个package.json文件。npm init初始化 生成packjson.json文件。安装node.js npm是依附node.js的。version:当前包的版本号。name:包/模块名称。安装最近版本的npm。
2023-01-11 14:06:26
525
原创 Antd中的getFieldDecorator用法和注意事项
getFieldDecorator ( “自定义控件名”,{ 表单规则 } ) (“取值标签” )第二个括号中的组件用一个气泡组件包裹的时候。监听不到input输入框内容的变化。
2022-11-07 19:04:07
9118
原创 以英文逗号隔开的数字(每个数字可保留两位小数)字符串的正则表达式写法
以英文逗号隔开的数字(每个数字可保留两位小数)字符串的正则表达式写法。以英文逗号隔开的数字字符串的正则表达式写法。
2022-11-03 18:43:33
1117
1
原创 在gitlab提MR时因为代码冲突提交不上去 该怎么解决?
提mr时因为代码冲突提交不上去 该怎么解决?在开发时,你拉取了一个新分支到本地,当你完成开发时,已经有同事将自己的代码合入源分支,这时提mr的时候 就会产生冲突,这时该如何解决
2022-10-31 19:08:20
1315
原创 Antd中form的方法 setFieldsValue设置的值是个变量 该怎么处理
setFieldsValue当设置的key值是个变量的时候需要用 ”[ ]“ 括起来
2022-10-28 11:06:00
777
原创 css优先级
行内式大于其他三个 内嵌式链接式导入式谁近谁生效ID选择器>类别选择器>标记选择器优先级算法:行内选择符 1,0,0,0 ID选择器0,1,0,0 类别/伪类选择器 0,0,1,0 元素选择器0,0,0,1!important优先级最高,出现冲突时比较四位数优先级相同时,采取就近原则继承来的属性,优先级最低...
2021-11-15 15:21:07
368
原创 css兼容性
产生兼容性的原因:不同厂商的浏览器或浏览器的不同版本对css的支持、解析不一样,导致在不同浏览器的环境中呈现出不一样的页面展示效果解决兼容性的方法:①CSS reset ②CSS hackcss reset:通过重置css默认样式来解决最基本的兼容性问题。css hack:为了获得统一的的页面效果,针对不同浏览器或不同版本写特定的css样式css hack:①css属性前缀法 ②选择器前缀法...
2021-11-15 15:15:04
420
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人