- 博客(94)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 Nextjs+Supabase
本文介绍了如何构建一个基于Next.js和Supabase的Todo应用。首先需创建Next.js项目，然后设置Supabase数据库并配置环境变量。核心功能包括连接Supabase、CRUD操作（创建、读取、更新、删除任务）。部署到Vercel时需注意添加环境变量和版本兼容性问题。文章还提供了常见错误解决方法，如数据库连接失败、表不存在等问题，并推荐了相关学习资源。这个全栈应用演示了现代Web开发中前端框架与后端服务的集成方式。
2025-12-09 17:48:05
505
原创 前端开发/网页自定义调色板
增强版的调色板实现方案，包含HTML/JS和Vue3两个版本。主要是解决原生input颜色选择器的功能局限，提供了更丰富的交互体验：1) 包含颜色选择区域和色相滑块；2) 支持颜色预览和十六进制值显示；3) 提供吸管工具和预设色板功能；
2025-07-10 10:04:59
1011
原创 两张图片对比clip功能
基于HTML实现的图片对比功能，通过拖动滑块可以查看两张图片的差异。主要功能包括：1) 响应式布局，适应不同屏幕尺寸；2) 可拖动的滑块控制第二张图片的显示范围；3) 美观的滑块手柄设计，带箭头指示和半透明效果；4) 使用CSS clip-path实现图片裁剪效果；5) 移动端适配优化。代码结构清晰，包含完整的HTML、CSS和交互元素，适合用作图片对比功能的实现参考。
2025-07-09 17:53:50
1013
1
原创 列表元素滚动动画
本文实现了一个基于Vue2的列表滚动动画效果。通过自定义指令v-slideIn，结合IntersectionObserver和Web Animations API，当元素滚动到视口时触发滑入动画。主要特点包括：1) 仅在下滚时触发动画；2) 每个元素仅动画一次；3) 使用WeakMap存储动画实例；4) 包含滚动方向检测逻辑。代码提供了完整的Vue组件实现，包含动画参数配置、样式定义和生命周期管理，适用于需要展示列表项入场效果的场景。
2025-07-01 17:51:19
248
原创 实现表格插入内容打字机效果
目前随着大模型的应用场景越来越广泛，很多前端交互都需要和大模型进行一定同步，如果需要把大模型回答插入到表格中，可以使用打字机效果和大模型流式推送保持交互同步，下面是一个简单的表格插入文本的打字机效果实现
2025-03-14 09:19:11
275
原创 IP 地址格式校验（例如 xx.xx.xx.xx），通过正则表达式（Regular Expression）实现。以下是一个简单的校验 IPv4 地址格式的正则表达式
IP 地址格式校验（例如 xx.xx.xx.xx），通过正则表达式（Regular Expression）实现。以下是一个简单的校验 IPv4 地址格式的正则表达式
2025-01-10 15:39:03
271
原创 html/css实现鼠标hover移入时的卡片显示动画效果以及点击时动画效果（html、css版本以及vue版本）
html/css实现鼠标hover移入时的卡片显示动画效果以及点击时动画效果（html、css版本以及vue版本）
2024-12-05 15:36:48
1011
原创 前端实现选项多选效果（三层结构）
实现代码（基于vue2），如果想实现Vue3或者React或者svelete等其他框架。实现分项多选功能，原始数据格式如下（来自。让AI直接转换即可，正确率99%
2024-11-06 15:39:41
537
原创 简单实现进度条效果（vue2）
如果用echarts或者其他图表来写个进度条有点大材小用，所以直接简单html、js写一下就可以；以下代码基于vue2，部分代码来自国内直连。
2024-08-20 11:35:49
1807
原创 基于vue2手写图片放大预览功能，带有动画效果【已验证，功能正常】
当有些场景不适合使用其他库实现图片预览时，可使用以下代码，代码基于vue2版本，已验证，可以正常运行，注意缺失的图片，自己在路径下补一张就可以部分代码来自于国内直连。
2024-08-20 10:25:46
520
原创 当我把几十个文档用GPT4o建了一个知识库之后......
就变成了这个世界上最懂法的GPT，后面会为大家测试更多基于GPT的大模型知识库，建GPT知识库路径：基于GPT的知识库和智能体系统
2024-07-29 16:51:58
353
原创 关于vue-router的钩子函数（vue知识点/面试题）
Vue 2 中，Vue Router 提供了多个钩子函数（导航守卫）来控制路由的行为。这些钩子函数主要分为以下几类：
2024-07-29 16:25:11
327
原创 css快捷代码【超出一行文本显示省略号/超出三行显示省略号/超出n行...】
css快捷代码【超出一行文本显示省略号/超出三行显示省略号/超出n行...】
2024-07-24 21:06:03
434
原创 基于vue-grid-layout插件（vue版本）实现增删改查/拖拽自动排序等功能（已验证、可正常运行）
【拖拽】【卡片】【排序】前端对3×3（不一定，也可能多行）的卡片布局，进行拖拽，拖拽过程中自动排序，以下代码是基于vue2，可直接运行，
2024-07-24 18:58:54
716
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人