- 博客(61)
- 收藏
- 关注
RSS订阅原创 js 拷贝-包含处理循环引用问题
浅拷贝：适用于不需要递归复制嵌套对象或数组的场景。扩展运算符...和扩展运算符深拷贝：适用于需要递归复制嵌套对象或数组的场景。JSON.parse和（不支持特殊类型）递归函数第三方库（如 Lodash 的根据实际需求选择合适的拷贝方法，可以高效地实现对象和数组的拷贝。
2025-04-09 16:20:04
233
原创 寻找字符串数组中的最长共同前缀字符串
问题描述：给定一个字符串数组 strs，编写一个函数来找到这些字符串的最长公共前缀字符串，如果没有则返回空字符串""
2025-04-06 16:01:18
197
原创 浅谈 MVVM 模式
是一种软件架构设计模式，旨在将用户界面（UI）与业务逻辑分离，从而提高代码的可维护性和可测试性。它在现代前端开发和桌面应用开发中得到了广泛应用，尤其是在构建复杂的用户界面时，MVVM 模式能够显著提升开发效率和代码质量。
2025-04-05 20:03:38
545
原创 vue watch和 watchEffect
是一个更通用的 API，允许你监听一个或多个响应式数据源的变化，并在数据变化时执行指定的回调函数。它提供了更多的控制能力，例如可以指定监听的数据源、回调函数的执行时机等。是两个用于响应式地监听数据变化并执行副作用的 API。它们在功能上有一些相似之处，但用途和行为有所不同。是一个更简洁的 API，用于自动收集依赖并执行副作用。它会在首次执行时自动收集依赖，并在依赖变化时重新执行。模式，即回调函数会在首次执行时立即运行。在 Vue 3 中，
2025-04-05 19:43:35
495
原创 Vue路由守卫详解
Vue 路由守卫是 Vue Router 提供的一种功能，用于在路由导航的不同阶段插入控制逻辑，从而实现对路由跳转的精细化管理。
2025-04-03 11:59:16
828
原创 React.memo()和 useMemo()的用法是什么，有哪些区别
使用 React.memo()来优化组件的渲染性能，尤其是当组件的 props 没有变化时，避免不必要的重新渲染。使用 React.useMemo()来优化组件内的计算逻辑，避免重复计算，尤其是在计算复杂或耗时的场景中。根据具体的性能优化需求，选择合适的工具来提升应用的性能。
2025-04-01 20:41:51
828
原创 React 函数组件间怎么进行通信?
在 React 函数组件中，组件间通信的方式与类组件类似，但更多地依赖于函数式编程的特性。父子组件通信通过props从父组件向子组件传递数据。通过回调函数从子组件向父组件传递数据。兄弟组件通信通过共同的父组件的状态和回调函数实现。跨层级组件通信使用提供全局上下文。使用状态管理库（如 Redux、MobX）管理全局状态。事件总线通过全局事件总线发布和订阅事件（较少使用，但适用于某些场景）。
2025-04-01 20:34:08
494
原创 useState和useReducer的相同点和不同点
useState和useReducer是 React 中用于管理组件状态的两个重要 Hook，它们在功能上有一些相似之处，但也有明显的不同点。
2025-03-28 11:03:48
709
原创 记录react和vue 属性传组件相关的事宜
在 React 中，函数组件的属性（props）不仅可以传递数据（如字符串、数字、对象等），还可以传递组件本身。这种模式在 React 中非常常见，尤其是在需要动态渲染子组件或者实现高阶组件（HOC）时非常有用。
2025-03-27 20:26:36
431
原创 react中 useEffect和useLayoutEffect的区别
useEffect和都是 React 中用于处理副作用的 Hook，但它们在执行时机和用途上有一些关键区别。理解这些区别可以帮助你更好地选择适合的 Hook 来实现特定的功能。
2025-03-25 19:13:01
920
原创 新手小白 react-useEffect 使用场景
useEffect是 React 中的一个非常重要的 Hook，用于处理组件的副作用（side effects）。
2025-03-25 19:03:26
572
原创 craco.config.js是什么？
需要注意的是，执行 eject 后，你将不再享受 Create React App 提供的抽象和自动化功能，同时也需要自行处理配置和构建的相关问题。这意味着你对项目的配置和构建有更多的责任和掌控，但也能满足更灵活的定制需求。相关配置都隐藏起来，若需要修改配置可以执行以下命令将配置文件弹出来，但此操作是不可逆的。，开发者可以灵活地定制 React 项目的构建过程，而无需深入了解底层实现。命令的情况下，覆盖和扩展 CRA 的默认配置，从而满足更复杂的项目需求。，于是了解一下，这是一篇小白篇！
2025-03-10 15:50:50
581
原创 webpack file-loader和url-loader
会将文件内容转换为 Base64 编码；超过限制时，会退化为。目录，并为文件名添加哈希值。当文件大小小于 8KB 时，这里将匹配的文件输出到。
2025-03-10 15:09:14
596
原创 Vuex，sessionStorage，localStorage的区别
是一个常见的问题，主要考察你对前端状态管理的理解以及对浏览器存储机制的掌握。根据实际需求选择合适的工具：如果需要管理全局状态，使用 Vuex；如果需要持久化存储，使用。如果需要临时存储会话数据，使用。在面试中，关于 vuex。
2025-03-10 11:57:57
629
原创 webpack和vite的区别
根据项目需求选择合适的工具：如果追求开发速度和体验，Vite是更好的选择；如果需要高度定制化和成熟的生态系统，Webpack更为合适。
2025-03-10 11:42:34
536
原创 强缓存协商缓存
强缓存：当浏览器请求资源时，直接从本地缓存中获取资源，而无需向服务器发送请求。强缓存的实现主要依赖于 HTTP 响应头中的和Expires字段。协商缓存：当强缓存失效后，浏览器会向服务器发送请求，携带缓存标识（如或ETag），服务器根据这些标识判断资源是否发生变化。如果资源未变化，服务器返回状态码，浏览器继续使用本地缓存。
2025-03-10 11:26:10
288
原创 vue和react的异同
Vue.js 和 React 是目前前端开发中非常流行的两种框架/库，它们在设计理念、使用方式、生态等方面既有相似之处，也有显著的差异。
2025-03-10 11:23:11
681
原创 element-plus el-upload 因默认自动上传导致的一系列问题
然而就只上传了一个文件，提示的很莫名其妙，并且浏览器也会请求我上传的文件。最后跟同事请教下：说可能是el-upload 自动上传导致的，于是 设置。最后成功解决上述问题，想要完整代码的可以call我！然而这样写后上传文件，总是会提示。
2025-03-07 16:26:03
294
原创 element-plus el-upload支持拖拽和点击上传 且 固定某个按钮上传
在 Element Plus 中，el-upload组件支持同时实现拖拽上传和点击上传的功能。但是点击上传是整个div 都可以点击上传，然而在实际项目中，我们可能需要支持只点击某个按钮上传文件。
2025-03-05 19:37:39
285
原创 ！踩坑 element-plus el-upload兼容拖拽和点击上传的坑
组件中，是可以兼容拖拽文件和点击上传文件的，但是这个过程中没有等待用户确定上传这个文件的过程，什么意思呢？然而element-plus el-upload里面没有方法可以禁用弹起选择文件的框框。所有还有别的解决方案么，请各位大佬帮忙看看。但是上传文件后是要用户确定上传文件的。在 Element Plus 的。这个trigger，依然不起作用。
2025-03-05 16:41:23
218
原创 react 路由跳转的几种方式
Link>和<NavLink>：适合页面级导航，简单易用。和useHistory：适合编程式导航，适合在事件处理函数中使用。navigate函数：适合更灵活的路由控制，支持相对路径。<Redirect>：适合条件跳转，但在 React Router v6 中已被移除。根据你的具体需求选择合适的路由跳转方式即可。
2025-02-28 17:06:48
867
原创 TypeScript中定义枚举并使用，lint报错 ‘xx‘ is defined but never used
在 TypeScript 中定义枚举但未使用时，ESLint 会报错，这是因为 ESLint 的规则检测到枚举被定义但未被引用。
2025-02-25 15:31:25
352
原创 vue3 下载文件 responseType-blob 或者 a标签
在 Vue 3 中，你可以使用axios或fetch来下载文件，并将设置为blob以处理二进制数据。以下是一个使用axios。
2025-02-24 16:10:09
654
原创 vue3 文件类型传Form Data数据格式给后端
在 Vue 3 中，如果你想将文件（例如上传的 Excel 文件）以FormData格式发送到后端，可以通过以下步骤实现。这种方式通常用于处理文件上传，因为它可以将文件和其他数据一起发送到服务器。首先，创建一个 Vue 组件，用于选择文件并将其封装到FormData中。
2025-02-21 19:06:16
583
原创 vue3 采用xlsx库实现本地上传excel文件，前端解析为Json数据
根据实际需求，对数据进行格式转换或校验。通过以上步骤，你可以在 Vue 3 项目中实现本地上传 Excel 文件并解析为 JSON 数据的功能。
2025-02-21 18:51:00
619
原创 vue3 input type=“file” 修改样式
div class="file-box textThemeColor"><input type="file" class="file-btn" accept=".xls,.xlsx" @change="changeExcel($event)"/>点击添加</div>这就是效果啦，嘿嘿和。
2025-02-20 18:11:19
244
原创 手写call，apply，bind
call和apply都用于立即调用函数并改变上下文。call是逐个传递，apply是数组传递。实现时，主要通过临时属性绑定和调用目标函数。bind返回一个新的函数，this值和参数被预绑定。支持延迟调用和作为构造函数使用。实现时需要处理new调用的情况，并修复原型链。这些实现可以帮助你更好地理解 JavaScript 中的函数上下文和参数传递机制。
2025-02-19 20:30:38
339
原创 面试题之介绍下call，apply，bind相同点和不同点
call`、`apply` 和 `bind` 是 JavaScript 中用于改变函数执行时 `this` 指向的方法。- **`call`** 和 **`apply`** 用于立即执行函数，区别在于参数传递方式。- `bind`：接受一个 `this` 值和一系列参数，返回一个新函数，不立即执行。1. **改变 `this` 指向**：三者都可以改变函数执行时的 `this` 指向。- `bind`：返回一个绑定了 `this` 和参数的新函数。- **`bind`** 用于创建一个新函数，稍后调用。
2025-02-19 18:55:08
301
原创 面试题之箭头函数和普通函数有什么区别？
有自己的this，动态绑定。有arguments对象。可以用new调用。有prototype属性。语法稍显复杂。没有自己的this，捕获定义时的上下文。没有arguments对象。不能用new调用。没有prototype属性。语法简洁。根据实际需求选择合适的函数类型可以提高代码的可读性和效率。
2025-02-18 20:22:08
382
原创 Vuex，sessionStorage，localStorage的区别
Vuex适合管理 Vue 应用的全局状态，数据存储在内存中，适合临时存储。适合持久化存储不频繁更新的数据，数据存储在浏览器本地。适合存储单次会话的数据，数据存储在浏览器会话中。在实际开发中，可以根据需求选择合适的存储方式，也可以结合使用它们来满足不同的需求。
2025-02-17 17:55:28
602
原创 Vue3+ts 封装一个 tab标签页组件
在写项目的时候，用到了element-plus，在这个项目中需要使用tabs组件，但是使用element-plus 的tab组件来满足项目中的tab样式，有的时候会有点麻烦，且自己也想动手试试封装一个tab组件，于是，开干！* width：单个tab的款宽度---注意：如果需要在选中tab的后面加一个标识,比如：“当前”，则 * width和translate 计算有误，后面会出兼容版本。* tabs ：获取所有 tab的信息。* index ：标记选中的是第几个。这里面的选中下横线用的是绝对定位。
2025-02-13 19:49:10
671
原创 Git克隆代码No such file or directory
刚刚在github上克隆项目，出现”No such file or directory“提示。看到这篇，说可能式ssh key 过期了，于是根据里面的步骤重新生成了一个。仔细一看：我没有写 git clone！加上git clone 就ok了！没有好好看就直接google 了。结果还是出现这个提示。
2025-02-13 15:55:02
246
原创 【Vue3+ts 】 封装字典列表接口调用
但是如果上面的形参 data 是个函数呢，或者是个Ref / Reactive 类型的数据呢，于是需要在进行下判断，同时还给对应的字典数据缓存到sessionStorage 里面，如果已经有这个字典数据，则不用再次请求。可能有小伙伴会好奇 setSessionStorage 和 getSessionStorage 是什么？第一步：创建useFormAjax.ts 文件，封装getListByDicCode 函数。至此，一个请求字典的接口就封装完成了。这也是我封装的一个函数啦~~~第二步：在页面上使用。
2025-02-12 19:10:56
120
原创 vue3+ts 使用枚举类型作为Props属性的类型
当一个状态（status）组件的标识（dot）在整个项目中可能在左边或者右边时，需要通过Props来给他设置一个默认值，因为只有可能左边或者右边，所以可以用到。在Vue3中使用Typescript时，您可以通过定义一个枚举类型，然后再组件的props 定义中使用枚举来指定Props的类型。函数为 props 设置默认值， alignText 的默认值为。枚举类型 alignEnum 定义了可能的值，确保。枚举的成员，且默认值为。来定义Props的类型。在模板中可以直接访问。
2025-02-11 11:32:48
274
原创 Vue3 性能优化之shallowReactive和shallowRef
好在这种性能负担通常只有在处理超大型数组或层级很深的对象时，例如：一次渲染需要访问100，000+个属性时，才会变得比较明显。shallowRef 和 shallowReactive 通过减少不必要的深度响应式追踪，显著提高了性能。创建一个浅层响应式对象，只对对象的第一层属性进行响应式处理，不会递归的将嵌套对象的熟悉也变成响应式。创建一个浅层响应式引用，只对引用值的第一层数据变化进行响应式处理，不会递归追踪嵌套对象的变化。当不需要嵌套对象的深层次属性进行响应式处理时，使用它们可以避免不必要的性能开销。
2025-02-10 20:26:28
278
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人