- 博客(428)
- 资源 (4)
- 收藏
- 关注
原创 记录自己灵感闪现的开发语录 每日更新 记录变强或者变得更菜的过程
2018年8月6日 今日博客排名115万+ 1、大多数人不想成为菜鸟,但现实是大多数人是菜鸟,包括我。
2018-08-05 12:50:32 416
原创 supabase+prisma使用
执行完成,可以看到supabase中表已经创建完毕。密码:91WNjThcUhde8QHb。执行命令,进行数据模型迁移。数据库名称:blog。
2024-03-25 14:38:54 294
原创 nextjs getServerSideProps 中 context 获取当前的路由
context 对象包含一个 req 属性,它是一个 HTTP 请求对象。但是,请注意,req 对象通常是一个 Node.js 的 http.IncomingMessage 对象,它本身并不直接包含路由信息。要获取路由信息,您通常需要解析请求的 URL。这个函数接收一个上下文对象作为参数,这个对象包含了页面的请求信息,其中也包括当前的路由信息。从 Next.js 10 开始,context 对象中增加了一个 resolvedUrl 属性,它提供了完整的解析后的 URL 对象,
2024-03-24 21:24:26 124
原创 fs-extra 抱错解决 TypeError: Cannot read property ‘native‘ of undefined
在函数中,使用到的地方引入,修改为动态的。原来的写法,直接在最上面。
2024-03-23 23:06:05 123
原创 nextjs使用Link跳转改变query会触发getServerSideProps吗?答案否
使用 getInitialProps 或 fetch 在客户端获取数据:如果你只是想在客户端处理查询参数的变化,并获取相应的数据,你可以考虑在组件内部使用 getInitialProps(如果你的 Next.js 版本较旧)或在页面组件中使用自定义的 fetch 函数。这样,当查询参数变化时,实际上是导航到了一个新的页面,从而触发了 getServerSideProps。它通常在页面第一次加载时触发,或者在页面通过路由参数变化时触发(如果页面依赖于路由参数来获取数据)。,你需要采取一些额外的步骤。
2024-03-22 10:30:22 320
原创 nextjs getServerSideProps 获取url中的参数
请注意,如果正在使用动态路由(例如 pages/example/[id].js),还可以通过 context.params 对象访问路径参数。函数接收一个上下文对象(通常命名为 context),其中包含了有关请求的信息,包括查询参数、路径参数等。然后,可以使用这些参数进行数据获取或其他操作,并将结果作为 props 返回给页面组件。可以通过解构赋值的方式从。对象中提取所需的参数,如。函数的上下文对象来获取。
2024-03-22 09:53:23 243
原创 nextjs 使用 lru-cache 进行缓存,在api里访问不到page中的缓存
解决这个问题的一种常见方法是将缓存实例化为一个单独的模块,并在页面和API路由中共享这个模块。这样,无论是页面还是API路由,它们都可以访问到相同的缓存实例,从而实现数据共享。这样,页面和API路由都可以通过引入相同的cache.js文件来访问相同的缓存实例,实现数据共享。因为Next.js中的页面和API路由是两个不同的执行上下文,它们之间的数据共享并不直接。
2024-03-18 10:37:12 307
原创 网页SPA和MPA的区别
最后,从用户体验和开发效率的角度来看,SPA通常能提供更好的用户体验,因为它可以提供流畅的交互和动态更新,尤其适用于需要频繁交互和实时更新的应用。此外,MPA的开发模式可能更为简单,因为每个页面都是独立的,可以单独开发和测试。这意味着SPA的首屏加载时间可能较长,但之后的页面切换和更新都是通过动态修改页面的内容来完成的,无需重新加载整个页面。其次,从页面切换方式来看,SPA是通过前端路由来实现页面的切换的,它可以根据URL来加载对应的页面内容。而MPA则一般是通过超链接等传统的页面跳转方式来切换页面。
2024-03-17 09:48:42 250
原创 nextjs router.asPath router.pathname 介绍
返回当前页面的路径名,不包括查询参数。这个属性对于只需要获取页面路径名的情况很有用,比如进行路由条件判断或构建其他 URL。对象提供了很多有用的方法和属性,帮助你控制页面导航和获取当前路由信息。对象还提供了很多其他方法和属性,用于控制页面导航、获取查询参数等。的情况非常有用,比如在某些 UI 元素中显示当前页面的链接。路径,包括查询参数。这个属性对于需要显示当前完整。是两个常用的属性,它们各自提供了关于当前。在 Next.js 中,
2024-03-16 23:56:44 202
原创 node一直在同一行打印
在这个例子中,Processing…会首先被打印,然后当异步操作完成后,光标会被移回行首(\r),并打印 Done!,覆盖掉之前的文本。如果你想要在同一行上的特定位置打印文本,你可以使用 ANSI 转义序列来移动光标。使用 process.stdout.write() 在同一行上连续打印内容,而不让光标移动到新的一行。使用 ANSI 转义序列移动光标。
2024-03-14 17:06:08 149
原创 axios 请求 url 地址,判断网络地址是否存在
这个示例中的 isUrlReachable 函数会发送一个 GET 请求到指定的 URL,并返回一个 Promise。如果 URL 可连接,Promise 将解析为 true;否则,Promise 将解析为 false。同时,它会捕获并处理各种可能的错误情况。使用 axios 来判断一个 URL 地址是否可连接,通常涉及到发送一个 HTTP 请求到这个地址,并检查响应的状态码。如果请求成功,并且返回了 200 OK 状态码,那么通常可以认为这个地址是可连接的。
2024-03-14 16:27:48 348
原创 node glob 根据指定目录,获取目录和子目录中所有文件
在 Node.js 中,glob 是一个强大的库,它使用模式匹配来查找与指定模式匹配的文件路径。你可以使用它来根据一个目录获取该目录及其所有子目录中的所有文件。使用 glob.sync 时,它会直接返回匹配的文件路径数组,或者在出错时抛出异常。默认是异步的,它接受一个回调函数来处理找到的文件路径。如果你需要同步版本,是一个 glob 通配符,表示匹配任意数量的目录(包括零个)和任意文件。只返回文件路径,不返回目录路径。如果你还想获取目录路径,只需移除。定义了要匹配的文件模式。
2024-03-14 14:37:46 198
原创 child_process spawn 进入具体目录中 执行命令
在 Node.js 中,如果你想要使用 child_process.spawn 方法在一个特定的目录中执行命令,可以使用 spawn 方法的 cwd(current working directory)选项。这个选项允许指定子进程应该在其上运行命令的目录。
2024-03-14 09:28:59 151
原创 node的child_process执行命令,增加额外参数
在 Node.js 的 child_process 模块中,你可以使用 exec、spawn、execFile 或 fork 方法来执行外部命令。当你需要设置额外的环境变量时,你可以通过 env 选项来指定它们。以下是一个使用 child_process.exec 方法并设置额外环境变量的示例。
2024-03-14 09:14:42 386
原创 supabase行级安全性策略设置
这个策略的目的是确保只有与 user_id 匹配的用户才能插入新的 watches。请注意,为了使这个策略生效,你需要确保已经在 watches 表上启用了行级安全性(RLS),并且已经为适当的角色或用户分配了使用这个策略的权限。在 Supabase 中,使用 PostgreSQL 的行级安全性(Row-Level Security, RLS)功能来创建策略是一种常见做法,以确保只有特定用户能够执行某些操作(如插入、更新或删除行)。: 这指定了该策略是针对插入操作的。: 这是策略的名称。
2024-03-10 21:54:58 264
原创 nextjs link跳转 和 window.location.href 跳转的区别
Next.js 的 next/link 组件和浏览器原生的 window.location.href 之间的跳转在功能上都实现了页面跳转,但它们之间存在一些重要的区别,特别是在 Next.js 这样的服务端渲染(SSR)或静态站点生成(SSG)框架中。
2024-03-09 14:31:34 375
原创 react中zustand的使用
zustand 还支持中间件和开发者工具,这可以帮助你扩展功能、调试和监控状态。你可以查阅 zustand 的文档来了解更多关于这些高级特性的信息。zustand 是一个轻量级且易于使用的 React 状态管理库。它提供了简单而强大的 API,使你能够轻松地管理应用的状态。通过创建 store、在组件中使用 useStore Hook,以及利用响应式更新,你可以构建出高效且可维护的 React 应用。
2024-03-08 19:43:58 414
原创 nextjs怎么保存本地设置
在 Next.js 中保存本地设置通常涉及使用浏览器端的存储机制,如 localStorage 或 sessionStorage。这些机制允许你在用户的浏览器中存储键值对,从而实现用户特定的设置或偏好。
2024-03-08 16:14:37 227
原创 nextjs中配置images domains 有什么用
通过明确指定哪些域名是可信的,Next.js 可以确保只对这些域名下的图像进行优化,从而避免潜在的攻击。例如,如果你的图像存储在 Cloudinary 或 Imgur 等服务上,你需要将它们的域名添加到 images.domains 配置中,以便 Next.js 可以对这些图像进行优化。组件,或者你的图像存储服务不需要 Next.js 的优化,你可能不需要配置 images.domains。组件来加载图像时,Next.js 会自动处理图像的加载,包括自动压缩、格式转换以及响应式图像等优化。
2024-03-07 16:58:11 193
原创 react组件中svg的放置位置,是放到组件文件夹,还是放置到统一管理的地方
在React项目中,SVG的放置位置主要取决于你的项目规模和团队习惯。
2024-03-07 10:33:34 385
原创 使用typescript将2024-03-05T00:00:00+00:00这种格式 怎么转化为 年月日
在这个函数中,new Date(isoDateString) 创建了一个 Date 对象,它表示了 ISO 格式的日期时间字符串所代表的日期和时间。在 TypeScript 中,你可以使用 JavaScript 的 Date 对象来解析这个 ISO 格式的日期时间字符串,并从中提取出年月日的信息。最后,我们将这三个部分拼接成一个格式为 “YYYY-MM-DD” 的字符串,并返回这个字符串。在示例中,formattedDate 变量将包含 “2024-03-05”,这正是预期结果。
2024-03-07 10:12:09 245
原创 react 中组件的传参 怎么设置为可选的,比如加上?
在React中,组件的属性(props)通常被视为组件的输入。如果想让某个属性成为可选的,不需要做任何特殊的设置,因为默认情况下,所有属性都是可选的。在这个例子中,requiredProp是一个必需的属性,而optionalProp是一个可选的属性。如果在JavaScript中编写React组件,那么所有的属性默认都是可选的。不需要做任何特殊的标记来指示某个属性是可选的。然而,当使用TypeScript编写React组件时,可能需要明确指定哪些属性是可选的。来标记一个属性是可选的。
2024-03-07 09:23:00 372
原创 typescript的?? 和?: 和?.什么意思
在 TypeScript(以及 JavaScript)中,??: 和?. 是三种不同的操作符,它们各自有其特定的用途。
2024-03-04 15:07:20 223
原创 nextjs中_app.tsx下划线什么作用
在Next.js中,_app.tsx(或_app.js)是一个特殊的文件,用于初始化页面。下划线_前缀在文件名中具有特定的意义,它告诉Next.js这个文件是一个特殊的内置文件,用于覆盖或扩展默认的App行为。此外,_app.tsx也是Next.js应用程序的入口点之一。需要注意的是,_app.tsx文件默认是不存在的,只有在你需要的时候才会创建它。总的来说,在Next.js中,_app.tsx的下划线前缀表示这是一个特殊的内置文件,用于初始化页面和自定义App行为。
2024-03-01 15:12:51 254
原创 yarn Error: certificate has expired
首先,你可以使用yarn config list命令来查看当前的Yarn配置,包括strict-ssl的设置。这个命令会列出所有的配置选项和它们的值。设置完成后,你可以再次运行你的Yarn安装命令。由于strict-ssl已被设置为false,Yarn应该不会因为证书验证问题而失败了。这个命令会修改Yarn的全局配置,使其不再验证HTTPS服务器的证书。在输出中,你应该能找到strict-ssl这一项,并看到它的当前值。2、设置strict-ssl为false。1、查看当前的strict-ssl设置。
2024-02-18 20:25:52 1196
原创 nextjs use client 和use server区别
是用于在服务器端和客户端渲染时分别执行特定逻辑的自定义钩子。的主要区别在于它们的执行环境和渲染策略。在实际开发中,你可以根据具体的需求选择合适的钩子来实现你的业务逻辑。而在客户端渲染中,使用。主要用于服务器端渲染,它允许你在服务器端执行某些逻辑,比如数据获取、状态管理等。则主要用于客户端渲染,允许你在客户端执行一些特定的逻辑,比如UI更新、事件处理等。则主要用于客户端渲染,其渲染结果会根据客户端的状态进行动态更新。主要用于服务器端渲染,其渲染结果会直接发送给客户端。数据获取:在服务器端渲染中,使用。
2024-02-15 20:37:52 674
原创 pattern在代码里面的翻译
读英文文档,老是会出现一次单词比如。接地气翻一下,可能更好的理解。感觉就很高大上,正式翻译成。翻译为领导给你画的饼。
2024-02-14 17:35:03 113
原创 npm certificate has expired
因为淘宝镜像原地址2024年1月22日已过期。最近安装项目包,老是报错。所以设置最新镜像地址即可。
2024-02-01 15:17:06 356 1
原创 vue折叠展开transition动画使用keyframes实现
打开的时候宽度从0到300,关闭的时候,宽度从300到0。需求,我正常的菜单功能有隐藏与显示功能,需要增加动画。/* 使用 @keyframes 定义过渡效果 *//* 关闭时宽度从300开始 *//* 打开时宽度变为300 *//* 打开时宽度从0开始 *//* 关闭时宽度变为0 *//* 设置动画反向播放 *//* 应用定义的动画 *//* 添加过渡效果 */
2024-01-23 21:23:31 716
原创 docker在宿主机的位置,以及宝塔中tomcat,nginx日志路径
Docker 运行容器时,其文件系统是在宿主机上完成的 Merge,然后再挂载到容器内。可以通过 docker inspect 命令快速定位容器文件系统在宿主机上对应的目录。
2024-01-03 16:03:51 541
instantclient_12_2.zip
2019-09-27
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人