- 博客(225)
- 收藏
- 关注

原创 Vue3+TS+Node打造个人博客(总览篇)
从 Vue3 正式发布到现在,也快过去一年了(写这行文字的时候是2021年09月08日,拖延症…)。但是就我最近招聘面试的一些经历来看,很多 Vue 技术栈的候选人依然还没有使用过 Vue3。关于他们没有选择使用 Vue3 这个事情,我觉得也是可以理解的。一方面,Vue3 直接放弃了 IE11。虽然 IE 的用户数量在持续下降,但是想让老板们直接放弃 IE11 还是有一些困难。另外就是,做项目这种事情,有时候人们的选择就是能用就行,升级 Vue3 可能并不能给项目带来太多效益。对于一些历史悠久的项
2022-02-24 09:18:43
2504
原创 electron 的 appData 和 userData 有什么区别
在 Electron 中,appData和userData是两个相关但不同的目录,用于存储应用程序的数据。
2025-03-31 09:55:33
347
原创 zustand persist 和 zustand immer 分别是什么?
用于持久化状态,防止数据丢失。用于处理不可变状态更新,提高状态管理的可预测性和易维护性。两者结合可以为开发者提供更强大的状态管理解决方案。
2025-03-27 15:04:50
153
原创 window.btoa 和 atob 记不住,怎么根据字母意思去理解
通过这样的解释,你可以更容易地记住这两个函数的功能和名称含义。要根据字母意思去理解。
2025-03-19 16:22:44
139
原创 vue3 provide inject 具备响应式吗
机制本身并不直接提供响应式能力。想要实现响应式,你需要。的值,但子组件不会更新,仍然显示 “Hello”。对象,所以它是响应式的。是一个普通的字符串。在这个例子中,子组件注入了一个函数。是响应式的,但子组件需要手动调用。的值,子组件也会自动同步更新。的值,而不是自动响应。
2025-02-24 08:50:28
854
原创 怎么理解 js 中 undefined 和 null 的区别?
则意味着“有意为空”,是程序员显式设置的,表示该变量当前不应该有任何值。通常意味着“缺少值”,是 JavaScript 默认赋予未赋值变量的值。是 JavaScript 引擎内部使用的,而。更多的是程序员用来表示某个变量的空状态。
2025-02-18 14:02:40
174
原创 vue3 怎么自动全局注册某个目录下的所有 vue 和 tsx 组件
虽然已经有非常强大的 unplugin-vue-components 支持,但是在某些动态场景下,unplugin-vue-components 也选择了不支持。那么我们来了解下,在不使用 unplugin-vue-components 的情况下,怎么自动全局注册某个或某些目录下的 vue 或 tsx 组件。在开发 vue3 项目时,我们会有这样的诉求,怎么自动全局注册某个目录下的所有 vue 和 tsx 组件?是 Webpack 提供的一个方法,可以扫描指定目录下符合特定规则的文件,并将其作为模块引入。
2025-02-11 20:17:08
824
原创 vue3 的 onScopeDispose 是什么作用
onScopeDispose 是 Vue 3 中用于管理响应式副作用的一个重要 API,主要用于在当前活跃的 effect 作用域上注册一个处理回调函数。当这个作用域停止时,所注册的回调函数会被调用。这种机制使得开发者能够有效地清理和管理资源,尤其是在组合式函数中。
2025-02-06 16:10:27
590
原创 nginx location ~ ^ = @ 傻傻分不清楚?其实不难!
使用适当的location修饰符可以帮助优化 Nginx 的性能和响应能力。通过合理配置,可以确保请求被正确地路由到相应的处理逻辑,从而提高网站的效率和用户体验。
2025-01-14 13:59:36
1025
原创 MacOS15 bash 终端怎么使用网络代理
通过这些步骤,你可以在macOS的bash终端中成功配置和使用网络代理。首先,确认你的代理客户端的IP地址和端口。例如,假设你的HTTP代理为。
2025-01-09 14:08:48
866
原创 git push -f 指定分支
以上步骤可以帮助你将代码安全、有效地推送到指定的远程分支。如果在推送过程中遇到任何问题,请确保解决所有合并冲突或其他错误。确保你的本地仓库已经与远程仓库关联。使用以下命令将本地分支推送到远程指定分支。参数来设置上游分支,这样以后只需使用。如果这是你第一次推送该分支,可以使用。
2025-01-08 17:21:26
615
原创 JS 开发全栈项目,一个 pnpm 仓库就搞定!
当前,这个全栈博客项目已经改为了 pnpm monorepo 架构,前端和后端代码都在同一个代码仓中,无论是否使用 docker compose 都可以做到一键启动,一键 build 等,开发体验较好。当然,这只是 monorepo 的其中一个优点。我们采用的是前后端分离架构,在未改用 pnpm monorepo 架构之前,前后端代码是独立的工程。在开发环境下,我们在后端工程目录下通过命令npm start启动 PM2 开发服务,在前端工程目录下通过命令yarn serve。
2025-01-02 11:29:55
587
原创 阿里云CDN按峰值带宽计费和按流量计费哪个更划算
最终,选择哪种计费方式应根据你的具体使用情况、流量模式和预算来决定。可以在阿里云控制台中根据实际情况进行调整和测试,以找到最适合你的方案[1][2][3].在选择阿里云CDN的计费方式时,按峰值带宽计费和按流量计费的划算程度主要取决于用户的具体使用场景。
2024-10-10 22:55:29
712
原创 windows11 怎么安装 redis
由于 Redis 官方不支持 Windows,因此需要下载由微软维护的版本。通过以上步骤,您可以在 Windows 11 上成功安装并运行 Redis。命令测试连接是否成功,若返回。
2024-08-10 22:55:32
1817
原创 放弃使用外键时,sequelize 应该怎么使用?
在使用 Sequelize 时,如果不使用外键,数据一致性需要通过应用层逻辑来维护,因为数据库本身不会自动确保关联关系的完整性。选项,你可以在不创建数据库外键约束的情况下,管理 Sequelize 中的模型关联。通过这些方法,可以在不使用数据库外键的情况下,通过 Sequelize 和应用层逻辑来维护数据的一致性[1][4][5]。在使用 Sequelize 时,如果想放弃使用外键,但仍然希望在模型之间建立关联,可以通过设置。在应用层进行数据验证,确保在插入或更新记录时,数据的完整性和一致性。
2024-08-10 11:30:47
625
原创 useImperativeHandle 是什么?你可以理解为 vue3 的 expose
用于定义当父组件通过 ref 访问子组件时,实际暴露哪些方法或属性。这使得开发者能够控制父组件可以调用的接口,从而实现更好的封装。都是为了实现组件之间的接口控制,确保子组件的内部实现细节不会被直接访问。方法,父组件可以通过 ref 调用这个方法。允许父组件将 ref 传递给子组件。,两者都用于控制子组件向父组件暴露的接口。,父组件无法直接访问子组件的 ref。定义暴露给父组件的方法,同时使用。确实类似于 Vue 3 的。包裹子组件以转发 ref。在 React 中,
2024-08-09 11:38:12
551
原创 handlerbars 模板中怎么对数组执行 slice 操作
需要注意的是, JavaScript 的 slice 方法中的结束索引是独占的, 意味着它会包含到结束索引之前的所有元素, 但不包括结束索引本身。如果省略结束索引, 它会切到数组的末尾。slice 助手允许你指定切片的起始和结束索引, 给你灵活控制数组切片的能力。中切片索引 0 到 5 (不包括 5), 并遍历得到的数组。
2024-08-09 09:42:23
277
原创 tailwindcss @apply 和 @layer 有什么区别
apply用于将 Tailwind 的工具类应用到自定义的 CSS 类中,简化和复用样式。@layer用于将自定义样式归类到 Tailwind 的特定层中,确保样式的声明顺序和组织性。通过结合使用这两个指令,你可以在 Tailwind CSS 项目中更高效地管理和复用样式。
2024-08-08 14:27:26
1622
原创 怎么在 tailwindcss 项目中自定义一些可复用的样式
这些方法可以帮助你创建可复用的自定义样式,同时保持与 Tailwind 的一致性。选择哪种方法取决于你的具体需求和项目结构[1][2][4][5]。
2024-08-08 11:27:58
652
原创 handlerbars {{ 和 {{{ 的区别是什么
使用{{}}可以确保输出内容是安全的,防止 XSS 攻击。使用{{{}}}可以直接输出 HTML 内容,但需要确保输入内容是可信的,以避免安全风险。
2024-08-07 16:19:10
434
原创 useEffect 为什么会执行两次,导致接口重复调用
在使用 React 18 时,大家可能会有这样的困惑,希望在 useEffect 中调用接口查询一些初始化数据,但是发现接口调用了两次useEffect钩子在某些情况下确实会执行两次,这可能会让开发者感到困惑。让我们深入分析一下这种情况的原因和解决方法。
2024-08-06 09:54:28
3540
原创 ts 里类型定义为 number 和 Number 有什么区别?
1][2]. 这样可以更好地利用 TypeScript 的类型系统,并与其他原始类型的使用保持一致。总结:在 TypeScript 中,应该使用小写的。更符合 TypeScript 的类型系统,而。在 TypeScript 中,推荐使用小写的。是 JavaScript 中的对象[1].是 TypeScript 中的类型,而。主要用于特定的对象实例场景[1][2].来定义数值类型的变量和参数[1][2].来定义数值类型,而不是大写的。TypeScript中使用。
2024-08-06 09:32:14
845
原创 如果 useEffect 提供的空数组依赖,会在每次渲染都执行吗
当useEffect中没有提供依赖数组时,默认情况下,它会在每次组件渲染后执行。这包括组件的首次渲染和每次状态或属性变化导致的重新渲染。
2024-08-05 12:14:39
434
原创 yarn install 怎么不修改 lock
这个命令会严格按照 yarn.lock 文件安装依赖,如果 yarn.lock 和 package.json 不匹配,则会报错而不是更新 lock 文件[4]。yarn.lock 文件不存在,此时会根据 package.json 生成新的 yarn.lock[1][2]。package.json 中的依赖版本与 yarn.lock 中记录的版本不匹配[1][2][4]。确保提交代码时 package.json 和 yarn.lock 文件保持同步[1][2][4]。
2024-08-05 11:00:39
783
原创 设置了 robots.txt 禁止爬虫抓取,为什么还是能被百度搜索出来
如果其他网站链接了您禁止收录的网页,百度可能会通过这些外部链接收录您的网页[2]。在这种情况下,网页可能会出现在搜索结果中,但内容不会被抓取和建立索引。虽然大多数搜索引擎会遵守 robots.txt 的规则,但并不是所有爬虫都会严格遵守。robots.txt 文件可能存在配置错误或未正确放置在网站根目录[1][4]。百度可能已经在您设置 robots.txt 之前抓取并收录了网页。某些特殊情况下,搜索引擎可能会忽略 robots.txt 的限制,特别是当网页内容对用户查询非常相关时[5]。
2024-08-04 18:36:29
1251
原创 vue filter 只能用于插值语法中吗,属性绑定可以用 filter 吗
总之,Vue的过滤器不仅限于插值语法,也可以在属性绑定中使用,为数据格式化提供了灵活的方式[4]。这使得开发者可以在不同的场景下对数据进行转换和处理,提高了模板的可读性和复用性。从Vue 2.1.0版本开始,过滤器也可以用在v-bind表达式中[1][5]。Vue过滤器不仅可以用于插值语法中,也可以用于属性绑定中。过滤器可以用在双花括号插值中[1][5]。
2024-08-03 22:24:27
621
原创 uniapp android 怎么下载一个 zip 文件
请注意,在实际开发中,应当考虑文件大小、网络状况等因素,并添加适当的错误处理和用户界面反馈。此外,对于大文件下载,建议使用断点续传等优化技术来提高用户体验。
2024-08-03 22:09:58
994
原创 有了 createSlice,还有必要使用 createReducer 吗?什么情况需要 createReducer 呢?
它允许你直接定义 action 类型到 reducer 函数的映射,而不是通过。如果你有非常复杂的 action 处理逻辑,可能需要在多个地方重用或者需要更灵活的组合方式,当你在一个已经使用传统 Redux 模式的项目中逐步引入 Redux Toolkit 时,它提供了更高级的抽象,使得 Redux 的状态管理变得更加简单和直观。在某些高级场景下,你可能需要动态地添加或修改 reducer。总的来说,除非你有特殊的需求或者在处理特定的边缘情况,否则。当你需要对 reducer 的行为进行更精细的控制时,
2024-08-02 22:51:07
394
原创 React 函数式组件在更新渲染时,整个函数体都会执行吗?
在 React 函数式组件更新渲染时,整个函数体都会重新执行。这是 React 函数式组件的一个重要特性。理解函数组件的这一特性对于编写高效的 React 应用非常重要,可以帮助开发者更好地处理状态、副作用和性能优化。尽管函数体重新执行,但 React 会保留组件的状态。由于函数体每次都会重新执行,所以 Hooks 必须在函数的顶层调用,不能在条件语句中使用。可以在函数体内使用条件语句来控制渲染内容,但整个函数体仍会执行。每次组件重新渲染时,函数组件的整个函数体都会从头到尾重新执行。
2024-08-02 22:45:55
476
原创 React 组件有类似 Vue3 的 attr 的概念吗
这些方法都允许你在已经定义了 Props 的情况下,仍然能够接收和处理额外的属性。无论选择哪种方法,都能实现类似 Vue 3 $attrs 的功能,允许父组件传递额外的属性到子组件。React 确实没有像 Vue 3 的 $attrs 那样的内置概念,但我们可以通过一些技巧来实现类似的功能。这个自定义 hook 允许你明确地分离出已定义的 props 和额外的 props。这种方法允许组件接受所有有效的 HTML 属性,同时还可以定义自己的特定属性。这种方法会将所有未在 Props 中定义的属性收集到。
2024-08-01 16:19:13
290
原创 React18 怎么实现 vue3 computed 的效果
使用 useMemo 可以确保只有在依赖项发生变化时才重新计算值,从而优化性能。这与 Vue 3 的 computed 属性类似,都是用于缓存计算结果并在依赖更新时重新计算。React 18 中可以使用 useMemo hook 来实现类似 Vue 3 computed 的效果。需要注意的是,不要过度使用 useMemo,因为它也会增加内存使用。只在计算成本较高或者需要避免不必要的重渲染时使用它。
2024-08-01 16:14:19
799
原创 webpack devServer proxy 有哪些常用配置项,反向代理时修改 host 要怎么做
修改 Host 头的主要目的是解决跨域问题,因为服务器可能会根据 Host 头来判断请求的来源。通过修改 Host 头,可以让服务器认为请求是从允许的域名发出的,从而避免跨域限制[5]。changeOrigin: 设置为 true 时,会将请求头中的 Host 修改为目标 URL 的主机名[4][5]。context: 可以是路径字符串或路径数组,用于配置哪些请求需要被代理[1]。这会自动将 Host 头设置为目标 URL 的主机名[5]。target: 指定要代理的目标 URL[1][4]。
2024-07-31 11:50:12
920
原创 js 可以通过反引号调用函数吗
需要注意的是,虽然这种语法看起来像是通过反引号直接调用函数,但实际上是创建了一个带标签的模板字面量,然后将这个模板字面量作为参数传递给了指定的函数.但在实际应用中,你可能会进行更复杂的处理,比如格式化数值、转换大小写、添加样式标记等。你可以遍历这些数组,进行任何需要的操作(如格式化、转换等),然后返回最终的字符串结果。JavaScript 中可以通过反引号(模板字符串)来调用函数,这种用法被称为带标签的模板字面量.函数会被调用,接收模板中的静态字符串部分和动态表达式的值作为参数.在这个例子中,当调用。
2024-07-31 10:48:13
560
原创 uniapp scroll-view 怎么通过代码控制滚动到底部
这些方法都可以实现将 scroll-view 滚动到底部的效果[1][2][4]。选择哪种方法取决于你的具体需求和场景。第一种方法最简单,第二种方法可以更精确地控制滚动位置,第三种方法则更加灵活,可以适应不同的布局情况。在使用这些方法时,记得在适当的时机调用滚动方法,比如在数据更新后或者在用户触发某个操作后[4]。另外,为了提高性能,可以考虑使用节流函数来控制滚动方法的调用频率[4]。
2024-07-30 14:22:01
4273
原创 gpt4,gpt4o,gpt4o-mini区别
GPT-4o mini 在性能与成本效益之间提供了良好的平衡,适合许多应用场景,而 GPT-4 和 GPT-4o 则在处理更复杂和要求更高的任务时表现更为出色。
2024-07-30 08:22:37
12115
原创 create-react-app .env 文件可以自定义名字吗
总之,虽然你可以使用自定义名称的环境文件,但建议尽可能遵循 Create React App 的默认命名约定,以确保最佳的兼容性和可维护性。如果你确实需要使用自定义名称,请确保在你的构建和开发脚本中正确引用这些文件。注意,环境变量会被嵌入到构建中,所以不要在 .env 文件中存储任何秘密信息(如私有 API 密钥)[4]。要使用自定义名称的环境文件,你需要在启动或构建应用时指定文件名。每次修改 .env 文件后,你需要重启开发服务器才能使更改生效[2]。包来加载自定义名称的环境文件[2]。
2024-07-29 20:40:37
388
原创 现在还推荐使用 CRA 创建 React 项目吗?
总之,2024 年创建 React 项目时,建议选择 Vite 或其他现代 React 框架,而不是使用已不再维护的 CRA。现在不再推荐使用 Create React App (CRA) 来创建新的 React 项目了。其他 React 社区框架: React 官方现在推荐使用社区中流行的 React 驱动框架来创建新项目[4][5]。适合创建单页应用(SPA),也支持服务端渲染(SSR)[2][4]。Next.js: 成熟度高的 React 框架,适合需要服务端渲染或静态站点生成的项目[2]。
2024-07-29 14:21:27
1138
原创 Vue 项目中 marked.js 怎么定制链接的点击行为
这些方法中,第二种和第三种更符合 Vue 的组件化思想,因为它们不依赖于全局函数。第三种方法特别简洁,因为它不需要修改 marked.js 的渲染器。选择哪种方法主要取决于你的具体需求和项目结构。如果你需要在多个组件中重用这个功能,你可能想要创建一个可重用的组件或指令。在 Vue 3 组件中使用 marked.js 并定义有效的。在你的 Vue 组件中定义。
2024-07-28 11:16:52
600
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人