编程技术

Lottie 是一种开源动画文件格式，以 JSON 保存，可用于 Web、Android、iOS 等平台。文章核心是给出 QQ 客户端中 Lottie 文件的存放路径：Linux 下位于 `~/.config/QQ/nt_qq_一串哈希/nt_data/Emoji/BaseEmojiSyastems/EmojiSystermResource/`；Windows 下位于 `xxxxxx\Tencent Files\你的qq号\nt_qq\nt_data\Emoji\BaseEmojiSyastems\EmojiSystermResource`。进入这些目录即可找到所需的 Lottie 文件。读者可按此路径直接定位并提取 QQ 使用的动画资源。

本文介绍一个纯 HTML+CSS+SVG 实现的动画 404 报错页面，无需 JavaScript。页面包含眨眼、眼球移动、口鼻入场等趣味动画效果，并提供完整的响应式代码，可自动适配移动端。读者直接复制源码即可部署到自己的网站，为站点增加一个轻松的小彩蛋。代码结构简洁，主要利用 SVG 图形与 CSS 关键帧动画实现，包含 404 大号提示、返回首页链接等核心元素，兼顾视觉趣味与实用性。

文章分享了为Halo博客接入AI智能索引的完整流程与踩坑经验。作者选择智谱AI作为Embedding模型供应商，首先在应用市场安装Halo的AI基座与AI套件，并在智谱开放平台创建API Key。配置AI Foundation基座时需添加供应商并填写通用API端点与密钥，模型必须手动添加，因为自动获取不到所需的Embedding模型，需正确填写模型ID和类型。设置默认模型后，在AI套件中完成连通性测试。随后建立向量索引并开启AI对话功能，即可实现AI优先基于站内文章内容总结回答。读者按此步骤可少走弯路，顺利完成博客AI智能搜索部署。

本文介绍一个 Vue 古诗列表展示组件案例，涵盖父组件向子组件传递数据、v-for 循环渲染、props 类型验证与自定义验证器等核心技能。子组件通过 slice(0, num) 限制显示数量，并设置唯一 key 提升渲染效率；props 定义 poemArr（必填数组，需含 author 与 describe 字段）和 num（默认 2，范围 1-3）。父组件维护诗歌数据数组并动态绑定给子组件。案例还展示了 scoped 样式隔离、卡片式布局与配色方案，并给出扩展建议（动态数量、搜索过滤）。读者可掌握 Vue 组件通信、列表渲染、数据切片及验证器写法，适合初学 Vue 组件开发时练习。

Vue 中除静态绑定 props 外，可用 v-bind 或其简写 `:` 动态传值，支持字符串、数字、布尔值、数组、对象、表达式和响应式数据。对象有两种绑定方式：`v-bind="obj"` 会展开对象属性，子组件需分别声明匹配的 props；`:init="obj"` 则传递完整对象，子组件只声明一个 prop 并通过点语法访问。使用 reactive 或 ref 创建的数据修改后会自动更新子组件。注意对象为引用传递，子组件直接修改会影响父组件，需浅拷贝或深拷贝；props 可做类型校验，且应遵循单向数据流。属性独立时选分别绑定，复杂配置选完整对象传递。

Vue 中父组件通过 props 向子组件传递数据，实现组件间通信与数据共享。静态绑定时属性值默认为字符串，通过组件标签属性传参；子组件需用 defineProps 声明接收，否则数据被忽略。props 遵循单向数据流，子组件不可直接修改，需通过事件通知父组件；同时支持类型验证、必填、默认值及自定义校验。命名上子组件声明用 camelCase，模板中使用推荐 kebab-case。动态绑定可用 v-bind（:num="值"）传递变量或表达式，且能保留非字符串类型。Props 为响应式，父组件数据变化会自动同步。该机制保证了数据流可预测性和组件复用性。

Vue 默认组件样式全局生效，容易造成样式冲突。文章介绍 scoped CSS：为 style 添加 scoped 后，Vue 会给元素加唯一 data-v-xxx 属性并适配选择器，样式仅作用于当前组件及子组件根元素。父组件 scoped 不会渗透子组件内部；子组件根元素同时受父子 scoped 影响，内部元素仅受自身 scoped 影响。需影响子组件时可用 ::v-deep、/deep/、:deep()，也可用 CSS Modules。注意全局样式不应 scoped，避免过度使用，scoped 有少量运行时开销，第三方库样式可能需深度选择器。由此实现组件样式隔离，避免冲突。

该文演示 Vue 3 中组件的两种注册方式：全局注册通过 `app.component()` 在应用启动时完成，适用于按钮、输入框等通用组件，可在任何模板中使用；局部注册通过 `import` 导入，在 `script setup` 下自动注册，仅限当前组件使用，代码更清晰、避免命名冲突。父组件在模板中以标签形式引用子组件，标签名可使用短横线或帕斯卡命名，且需与注册名对应。示例包含全局组件（实线边框）与局部组件（虚线边框），在父组件中并排显示。关键要点包括：按使用场景选择注册方式，`script setup` 自动注册已导入组件，父组件引用子组件形成父子关系，同时应避免组件自引用或循环引用以防死循环。

该文解析了基于HarmonyOS ArkUI 3.0与TypeScript开发的用户登录页面。页面采用声明式UI与分层组件架构，通过@Entry、@Component、@State等装饰器实现状态驱动的界面更新。核心功能包括手机号非空及格式校验（正则表达式）、实时错误反馈、防重复提交的登录流程，并展示输入框封装、按钮加载态切换、条件渲染成功视图等关键实现。文章还详解了以#1FA485为主色的视觉规范、响应式布局策略及性能优化思路，如最小化状态管理、减少嵌套层级。整体架构清晰，是学习ArkUI声明式开发、表单验证与移动端界面设计的实用范例。

本文解析基于 HarmonyOS ArkUI 开发的注册页面 textinput1.ets，展示声明式 UI 与响应式状态管理的最佳实践。页面采用分层组件结构，使用 @State 管理账号、密码、邮箱及提交状态，通过条件渲染切换注册表单与成功视图。关键技术包括：TextInput 的 onChange 双向绑定、按钮加载状态与防重复提交、setTimeout 模拟网络请求、$r() 资源引用，以及统一绿色主题与百分比布局的响应式设计。文章还涵盖性能优化要点，如最小化状态变量、减少嵌套和条件渲染。该范例架构清晰，适合开发者学习用 ArkUI 快速构建高质量移动端表单界面。