乐闻
TA的文章
你了解扫码登录的本质和原理吗？
你了解扫码登录的本质和原理吗？我们日常生活中会使用到各种各样的系统，比如微信，qq，哔哩哔哩等等。这些系统都是要求登录的，登录的方式也有好几种方式，常见的登录方式有表单登录，扫码登录，移动端三方授权登录等。登录的本质是什么呢？我认为登录的本质就是服务器确认用户的身份，并且授予客户端身份证，比如token,sessionId。用户确认身份后才进行进一步的操作，比如订单功能，收藏功能等等。本文介绍一下
「自己动手丰衣足食」搭建React脚手架
前言刚开始学习React的朋友基本都是从Facebook官方提供create-react-app脚手架开始，别人的脚手架开箱即用固然爽，但是有的时候想要进行一些功能的拓展（集成less等)就需要去百度谷歌。因为脚手架把整个项目的编译构建过程高度集成了，我们想通过脚手架生成的代码学习项目工程化，刚开始肯定是大难度的。伟人曾道：自己动手，丰衣足食。为了更深层次的去学习react，去尝试理解react项
分治思想在排序算法中的应用 - 快速排序&归并排序
前言排序算法在编程中是最简单最基础的算法，同时快速排序和归并排序都是通过递归调用的方式进行排序的，对于递归而言，比较不好理解。记录一下快速排序和归并排序的Javascript代码实现以及两种算法的相同点与差异性。快速排序functionquickSort(arr){if(arr.length=1){returnarr;}constmid=Math.floor(arr.length/2);const
Tailwindcss 配置检查器 - 可视化查看tailwindcss config最终效果
tailwindcss框架为我们提供了大量默认的类和属性，而且开发者也能够自定义类和配置。对于初学者来说，这些配置其实是比较复杂的，这也是tailwindcss最大的入手成本，开发者的记忆负担和心智负担也都比较大。有没有办法能够直观的看到项目中实际有效的类和属性呢？工具NPM包tailwind-config-viewerhttps://npm.devtool.tech/tailwind-con
Git 如何删除本地分支与删除远程分支
Git允许我们创建、合并甚至删除分支。本文将学习如何在Git中删除本地分支和远程分支。删除本地分支在删除一个本地分支之前，确保你没有切换到该分支上。如果你正处在要删除的分支上，请先切换到一个不同的分支：gitcheckoutmaster现在，你可以使用以下命令删除分支：gitbranch-d<branch_name>如果该分支有尚未合并的更改，Git会给你一个警告。如果你确定要删除这个
一文教会你如何使用 Vercel 部署你的 NestJS 应用
这篇文章详细解析了如何使用Vercel免费部署Nestjs项目的步骤。首先，我们需要在Nestjs项目中添加Vercel的配置文件。接着，我们将项目上传到GitHub，然后授权给Vercel。选择GitHub上的项目，通过Vercel平台创建新项目并完成部署。此外，如果你想使用个人域名访问你的服务，Vercel也提供了这样的支持，你只要有一个通过备案的个人域名，就可以将其配置到你的Vercel项
Koa.js 如何处理 CORS 跨域问题
在现代的web开发中，CORS（Cross-OriginResourceSharing，跨源资源共享）是一个常见的问题。由于浏览器的同源策略限制，当我们尝试进行跨域请求时，例如从http://domain-a.com向http://domain-b.com发送AJAX请求，浏览器会拦截这些请求。幸运的是，Koa这样的现代框架提供了优雅的解决方案。在本教程中，我们将通过简单易懂的方式来掌握如何在Ko
Webpack 面试题汇总
什么是前端模块化？AMD、CMD、CommonJS、ES6模块化之间的区别是什么？模块化是指将一个复杂的系统分解为多个模块以方便编码。模块化规范的实现是为了达成浏览器端模块化的目的。AMD是一种Javascript模块化规范，采用异步的方式去加载依赖的模块。不用转换代码的情况下直接运行在浏览器环境。依赖前置，提前执行。代表库requirejsCMD是一种Javascript模块化规范，依赖就近
如何在 NestJS 中安全高效的管理 Config 配置
应用程序通常需要在多种环境中运行，比如本地开发环境、测试环境和生产环境。在不同的环境中，我们通常需要采用不同的配置设置。举个例子，本地环境可能需要一个特定的数据库凭据，而生产环境则使用另一组完全不同的数据库凭据。由于这些配置变量频繁地改变，因此最佳实践是将它们存在环境变量中。在Node.js中，外部定义的环境变量可以通过process.env全局变量来访问。一种可能的做法是在每个环境中设置不同的环
Flutter 设置 Lottie 动画的详细教程
Lottie是一个流行的库，可以让你在移动应用中轻松添加高质量的动画。它支持Android、iOS、Web以及其他多个平台，因此非常适合跨平台框架Flutter。在这篇教程中，将简要介绍如何在Flutter应用中使用Lottie动画。什么是Lottie?Lottie是Airbnb设计的一个库，可以帮助开发者轻松添加动画到任何应用。Lottie动画是基于JSON文件的，这些JSON文件通过Adob
一篇文章学会 NestJS 的拦截器并且附带实战操作案例
在现代Web开发的世界中，NestJS以其灵活性和强大的功能立足，成为Node.js框架的佼佼者。其中一个引人注目的功能就是拦截器，这是一种可以让开发者更好地控制和补充HTTP请求循环的工具。拦截器让开发者可以在处理程序之前或之后“拦截”HTTP请求，这是解决一系列问题的基石。什么是NestJS拦截器简单来说，拦截器是一种特殊类型的服务，运行在路由处理程序方法之前和之后。它们在每次请求和响应的生命
基于React创建重叠头像组件，深入理解CSS重叠样式
最近项目有个新需求，需要把用户的头像水平排列并且重叠。本来以为挺麻烦的，刚开始还想着要用JS去计算每一个头像需要位移的距离。其实这个需求只需要一行代码就能搞定。最终的效果图如下：效果图实现方案首先定义HTML代码结构importReactfrom"react";import"./index.less";constavatars=["<https://upload.jianshu.io/u
NestJS 基于 Passort 和 JWT Token 实现接口的权限管理
如果你不希望其他人可以随意进出你的房子，那么你需要给你的房子上个锁。开发一个接口很容易，开发一个具有安全性的接口却不容易。成熟的后端服务项目最注重的一点就是如何保护系统的数据安全，不能让用户无脑的访问操作所有的数据，这是不合理更是极度危险的行为。NestJS作为企业级后端开发框架，自然会提供一套权限校验的方案，本文基于NestJS的passort方案，结合jwttoken完成对系统服务的保护。
React 如何使用 Recoil 实现状态共享
React状态管理一直是一个让人头疼的问题，随着应用的增长，组件之间共享状态变得越来越复杂。此时Recoil就出现了，它是一个为React应用设计的状态管理库，它提供了一种简单和高效的方式来管理和共享状态。优势原子化状态：Recoil将状态定义为一系列的“原子”，这些原子状态可以在应用的任何组件中被读取和更新，而不需要考虑组件层次结构。派生状态：可以创建基于原子或其他派生状态计算得出的状态，这些
如何在 Nest 项目中自定义装饰器
装饰器的作用就像其名字一样，它就像一件华丽的外衣，给你的NestJS代码提供了吸引力和可读性。这是因为装饰器可以改变我们对代码的处理方式，并帮助我们实现更高级的编程模式。在本文中，我们将探讨如何创建自定义装饰器，这将大大增强我们的NestJS使用体验。装饰器类型类装饰器(ClassDecorators)在NestJS中，类装饰器最常用在控制器和模块定义上，例如@Controller等。方法装饰
前端开发中如何利用里氏替换原则(Liskov Substitution Principle)
在谈论软件设计模式和原则时，我们经常提到SOLID原则，它是面向对象设计的五个基本原则中的一个，其中L代表的是里氏替换原则（LiskovSubstitutionPrinciple,LSP）。这个原则是由BarbaraLiskov提出的，它的核心思想是：“子类对象应该能够替换它们的父类对象被使用，而不破坏程序的正确性。”在前端开发中，如果我们正确地应用了这一原则，那么我们的代码将会更加灵活与可维护
如何使用 git stash 暂时缓存 git 工作区或暂存区的内容改动
在日复一日的代码开发过程中，我们经常会遇到这样的情境：你正在开发一个新功能，但是突然需要切换到另一个分支处理一个紧急bug。这个时候，你的代码又处于半成品状态，既不想提交一个半成品的commit，又不想丢失当前的工作进展。这时候，gitstash就是你的救星。今天，我们就来深入了解一下这个强大的Git工具。gitstash是什么gitstash命令可以将你的工作区和暂存区的改动“储藏”起来，让你
Mongoose 如何查询某个字段为空、null、不存在的数据
在使用MongoDB数据库进行数据管理时，经常会遇到需要查询某些字段为空或者不存在的文档的情况。Mongoose为MongoDB提供了直观的建模和查询语法。本文将介绍如何在Mongoose中查询具有空字段的文档，确保能够轻松处理各种数据查询需求。MongoDB中的「空」有哪些首先，我们需要理解在MongoDB中，一个字段被认为是空的情况可能有几种不同的状态：字段值为null。字段不存在。字段值为空
使用 VSCode 开发 Flutter 应用：从入门到实践
Flutter是Google推出的一款开源的移动应用开发框架，可用于快速开发高质量的原生应用。而VisualStudioCode(VSCode)是目前非常流行的一款轻量级代码编辑器，它支持多种编程语言，并且拥有丰富的插件生态。在这篇教程中，我们将详细介绍如何在VSCode中配置和使用Flutter，帮助你高效地开发移动应用。使用步骤一、安装必要的软件在开始使用VSCode开发Flutter应用之
前端如何利用工厂模式
在探索优雅且高效的代码设计道路上，设计模式作为一盏指路明灯，引导着开发者们前进。今天，我们要深入了解的是工厂模式（FactoryPattern），一个在前端开发中应用广泛的设计模式。通过它，我们可以创建出一个对象的"工厂"，专注于生产对象，从而实现对象创建与业务逻辑的具体实现分离。工厂模式的核心理念工厂模式的核心理念在于提供一个创建对象的接口，而不需要关心具体的类实现。在前端开发中，这个概念尤为
TA的教程专栏
TailwindCSS 使用指南
Tailwind CSS 是一个流行的 CSS 工具库，它提供了一系列预定义的 CSS 类，可以帮助您轻松地创建漂亮的用户界面。本教程将帮助您深入了解 Tailwind CSS 的高级功能和技术，以帮助您更好地利用这个强大的工具库。 在本教程中，您将学习到： 如何使用 Tailwind CSS 的主题和变量来自定义外观和样式； 如何在 Tailwind CSS 中配置和使用插件来扩展其功能； 如何在 Tailwind CSS 中使用 JS 钩子和样式函数来创建动态样式； 如何在 Tailwind CSS 中创建响应式布局和样式； 如何在 Tailwind CSS 中使用 PurgeCSS 来优化和精简 CSS。 本教程适合那些已经有一定 Tailwind CSS 开发经验，并想要深入了解其高级功能和技术的开发人员。无论您是初学者还是有一定经验的 Tailwind CSS 开发人员，本教程都将为您提供宝贵的学习资源和实践经验。 让我们开始您的 Tailwind CSS 进阶之旅吧！
Typeorm 使用指南
TypeORM 是一个流行的 TypeScript ORM（对象关系映射）库，它可以帮助您轻松地将 TypeScript 类映射到关系型数据库表。本教程将帮助您深入了解 TypeORM 的高级功能和技术，以帮助您更好地利用这个强大的库。 在本教程中，您将学习到： 如何使用 TypeORM 中的高级查询和过滤功能来查询和操作数据库； 如何使用 TypeORM 中的实体继承和关系映射来创建复杂的数据模型； 如何使用 TypeORM 中的迁移和数据填充来管理数据库模式和数据； 如何在 TypeORM 中使用存储过程和触发器来扩展数据库功能； 如何在 TypeORM 中使用多数据库和分布式事务来管理复杂的应用程序。 本教程适合那些已经有一定 TypeORM 开发经验，并想要深入了解其高级功能和技术的开发人员。无论您是初学者还是有一定经验的 TypeORM 开发人员，本教程都将为您提供宝贵的学习资源和实践经验。 让我们开始您的 TypeORM 进阶之旅吧！
如何打造属于自己的React组件库
随着组件化开发成为前端开发的主流，拥有一套定制化的React组件库变得极其重要。本系列教程将指导你如何设计、开发和维护一个React组件库，不仅满足项目需求，而且易于共享和复用。我们将从React组件的基础知识开始，逐步讲解如何构建可复用组件、如何管理组件状态和生命周期、以及如何通过Prop Types和TypeScript进行类型检查。此外，你还将学习到如何利用Storybook来展示组件、使用Jest和Enzyme进行单元测试，以及如何将你的组件库发布到npm。 通过本系列教程的学习，你将获得创建自己React组件库的全部技能，为你的开发工作带来前所未有的效率和乐趣。
Mongoose 使用指南
在本教程中，我们将逐步探索Mongoose——一个在Node.js环境下与MongoDB数据库协同工作的强大库。从基本概念的铺垫到实用技巧的深度剖析，本系列覆盖了Schema设计、数据类型定义、模型创建、查询优化、插件扩展等核心主题。你将学习如何利用Mongoose的Schema来定义数据结构，实现数据验证和类型转换，以及如何通过模型进行数据的增删改查操作。 此外，教程将深入Mongoose的高级特性，包括但不限于索引管理、聚合框架、事务处理和数据迁移。我们将通过丰富的示例和练习，教你如何运用Mongoose来处理复杂查询、关联数据以及性能调优。 随后，本系列教程将深入讨论更高级的特性，如中间件（pre和post hooks）、数据校验、虚拟属性和实例方法，以及如何使用聚合管道进行复杂查询。此外，我们将详细介绍如何处理关系型数据，在Mongoose中实现文档的嵌入和引用，以及如何优雅地处理这些关系。 为了将理论与实践相结合，每一部分内容都包含了逐步的代码示例和实战小项目，帮助你更好地理解和运用Mongoose的功能。我们还会讨论性能调优、错误处理和最佳实践，以确保你能够构建既健壮又高效的Node.js应用。
CSS 入门指南
CSS 是一种用于描述文档样式和布局的样式表语言，它是 Web 开发中不可或缺的一部分。本教程将帮助您从零开始学习 CSS，了解其基本概念和语法，并逐步深入学习其高级特性和实践技巧。 在本教程中，您将学习到： CSS 基础知识，如选择器、盒模型、布局等； CSS 颜色、字体、背景和边框等样式属性的使用； CSS 媒体查询和响应式设计的实现； CSS 动画和过渡的实现技巧； CSS 预处理器，如 Sass、Less 的使用； CSS 框架，如 Bootstrap、Tailwind CSS 的使用。 本教程适合那些想要从零开始学习 CSS 的初学者。无论您是 Web 开发新手还是有一定经验的开发人员，本教程都将为您提供宝贵的学习资源和实践经验。 让我们开始您的 CSS 入门之旅吧！
React 入门宝典
React 是一个流行的 JavaScript 库，用于构建大规模、高性能的 Web 应用程序。本教程将帮助您从 React 的基础知识入门开始，逐步深入掌握 React 的高级概念和技术，以成为一名优秀的 React 开发人员。 在本教程中，您将学习到： React 的基础概念和核心原则，如组件、Props、State、生命周期等； 如何使用 JSX 语法编写 React 组件和模板； 如何使用 React 的事件处理、表单处理、样式管理等功能； 如何使用 React Router 实现单页应用程序； 如何使用 Redux 进行状态管理和数据流控制； 如何使用 React 的高级技术，如 Hooks、Context、Portal 等。 本教程适合那些已经有一定 JavaScript 编程经验，并希望进一步学习 React 技术的开发人员。无论您是初学者还是有一定经验的 React 开发人员，本教程都将为您提供宝贵的学习资源和实践经验。 让我们开始您的 React 之旅吧！
Web项目国际化通关手册
React 国际化是指将应用程序适配到不同的语言和地区的过程。在全球化时代，为您的应用程序提供多语言支持将为您的用户提供更好的用户体验，并帮助您扩大全球市场。本教程将帮助您学习如何在 React 应用程序中实现国际化。 在本教程中，您将学习到： React 国际化的基本概念和原则； 如何使用 React Intl 库来实现国际化； 如何在 React 中处理多语言文本、日期、时间和货币等； 如何在 React 中实现动态文本替换； 如何在 React 中切换不同的语言版本； 如何测试和调试国际化应用程序。 本教程适合那些已经有一定 React 开发经验，并想要扩展其应用程序的全球化能力的开发人员。通过本教程，您将学习如何使用 React Intl 库和其他现有工具来实现国际化，从而为您的应用程序提供更广泛的用户群和更好的用户体验。 让我们开始您的 React 国际化之旅吧！
Nodejs 学习指南
这是一套全面的Node.js学习指南，覆盖了从基础知识到高级应用的全部必备技能。本教程系列将带领你进入Node.js的世界，一个强大而灵活的JavaScript运行时环境，它让JavaScript不仅仅能在浏览器中运行。你将了解到如何设置Node.js环境、利用npm管理包，以及如何构建第一个应用程序。随着课程的深入，我们会探讨异步编程模型、中间件、RESTful API设计、数据库集成、安全性、测试以及性能优化等进阶主题。 无论你是初学者还是有志于成为全栈开发者，本教程都将为你提供一个扎实的Node.js学习基础和实践路径。
NestJS 最佳实践手册
在这个全面的NestJS最佳实践手册中，我们将一起探索如何使用NestJS这个强大的Node.js框架来构建可维护、可扩展的企业级应用。从NestJS的基本概念和架构出发，到深入了解其依赖注入、模块化和微服务等核心功能，本手册将为你提供一系列的专业指导和实用技巧。 我们将讨论如何有效地利用TypeScript的强类型能力，如何整合ORM以实现数据库操作，以及如何应用中间件、守卫、过滤器和拦截器来增强应用的安全性和性能。 通过实际案例和模式分析，这本手册不仅会教你如何编写代码，更重要的是教你如何思考NestJS应用的设计和结构，让你成为在现代后端开发领域中的专家。
Nextjs 全栈开发手册
在这个系列教程中，您将踏上一段探索 Next.js 的精彩旅程。Next.js 是一款基于 Node.js 和 React 的现代化框架，专为构建快速、静态生成和服务器端渲染的Web应用而设计。无论您是前端新手还是经验丰富的开发者，本教程都将以步骤分解的方式带领您从基础概念到高级功能，全面了解 Next.js 的核心特性。 我们将从 Next.js 的安装和基本配置开始，逐步深入到路由、状态管理、构建优化以及部署策略。通过实际案例，您将学会如何利用 Next.js 提升开发效率，提高应用性能，并构建出具有优秀SEO表现和用户体验的Web应用。 随着本系列教程的深入，您将掌握 Next.js 最佳实践，与此同时，我们还将涵盖如何整合RESTful API和GraphQL、使用静态站点生成(SSG)与服务器端渲染(SSR)的先进技术，以及如何借助 Vercel 等平台，实现无缝的生产部署。 让我们一起开启这次学习之旅，探索 Next.js 带来的无限可能，为您的前端技能树添上一笔重要的一笔。
TA的问题
TA的面试题
- Canvas 动画怎么实现？如何优化性能？Canvas 动画本质是逐帧重绘：每帧调用 `requestAnimationFrame` 回调，在其中更新状态、清除画布、重绘所有元素，浏览器按刷新率（通常 60fps）将帧提交到屏幕。性能优化的核心思路是减少每帧的计算量和绘制量：用 `OffscreenCanvas` + Worker 将计算和预渲染移到后台线程；用对象池复用粒子避免 GC 压力；用脏矩形只重绘变化区域；分层 Canvas 将静态背景和动态前景分离；批量绘制减少状态切换。 ## 追问 - `requestAnimationFrame` 和 `setInterval` 做动画有什么本质区别？ - `Offscree...
- Canvas 元素是什么？和 SVG 有什么区别？Canvas 是 HTML5 的 `<canvas>` 元素，提供一块可编程的像素级绘图表面。通过 JS 获取 2D 渲染上下文（`getContext('2d')`）或 WebGL 上下文来绘制图形。核心用途：数据可视化、2D 游戏、图像处理、动画、视频特效。与 SVG 的关键区别：Canvas 是栅格模式（像素绘制，适合高频更新和大量对象），SVG 是矢量模式（DOM 节点，适合交互和缩放）。Canvas 不保留绘制对象，每帧是完整重绘。 ## 追问 - Canvas 2D 和 WebGL 上下文有什么区别？什么场景需要用 WebGL？ - Canvas 重绘时旧内容去哪了？为什...
- Canvas 路径绘制和图形变换怎么用？路径绘制分三步：定义路径、闭合路径、渲染路径。先用 `beginPath()` 清除旧路径，`moveTo()` 定起点，再用 `lineTo()`/`arc()`/`bezierCurveTo()` 等绘制子路径，最后 `closePath()` 闭合并用 `fill()` 或 `stroke()` 渲染。图形变换通过坐标系变换实现：`translate(x,y)` 平移原点、`rotate(angle)` 绕原点旋转、`scale(sx,sy)` 缩放，`transform(a,b,c,d,e,f)` 直接设置变换矩阵。变换是累积的，用 `save()/restore()` 管理状态...
- Nuxt.js 的路由系统和 Vue Router 有什么不同？核心区别：Vue Router 需要手动在 router.ts 中声明路由表（path/component 映射）；Nuxt 基于文件系统自动生成路由——pages/ 目录的文件路径即路由路径。例如 pages/user/[id].vue 自动映射为 /user/:id，pages/user/index.vue 映射为 /user。Nuxt 还内置了 layouts/ 布局系统、middleware/ 路由中间件（替代 Vue Router 的 beforeEnter/全局守卫），以及 NuxtPage 和 NuxtLayout 组件处理嵌套路由渲染。底层仍使用 Vue Router，但...
- Nuxt.js 中如何管理状态？useState 和 Pinia 怎么选？Nuxt 3 推荐两种方案：内置的 `useState()` composable 和 Pinia（通过 `@pinia/nuxt` 模块集成）。`useState()` 适合跨组件共享简单响应式状态，天然 SSR 安全——服务端和客户端状态自动同步，无需额外处理水合。Pinia 适合复杂状态管理，支持 actions、getters、插件生态，且同样对 SSR 友好。Vuex 是 Nuxt 2 时代的默认方案，Nuxt 3 已不再内置。 ## 追问 - `useState()` 和 `ref()` 在 SSR 场景下有什么区别？为什么不能用 `ref()` 共享状态？ - Pini...
- Nuxt.js 的 SSG 和 SSR 有什么区别？怎么选？SSG 在构建时（nuxt generate）遍历所有路由，执行数据获取逻辑，生成完整静态 HTML 文件，部署到任意静态服务器即可，请求零服务端开销；SSR 在每次请求时由 Node 服务动态渲染 HTML，内容实时但需要持续运行服务器。Nuxt 3 通过 routeRules 支持混合模式：同一个应用中，博客页 SSG、商品页 ISR（swr 缓存）、后台 SPA，按路由粒度选择渲染策略，不再需要二选一。 ## 追问 - ISR（Incremental Static Regeneration）在 Nuxt 3 里怎么实现？和 Next.js 的 ISR 有什么区别？ - SSG ...
- Nuxt.js 的模块和插件有什么区别？模块（Module）在 Nuxt 初始化阶段执行，能修改构建配置、注册插件和中间件，是 Nuxt 核心扩展机制，通过 `nuxt.config` 的 `modules` 数组注册。插件（Plugin）在 Vue 实例化前后执行，用于注册全局组件、指令或注入实例属性，放在 `plugins/` 目录自动注册。关键区别：模块可以注册插件，反过来不行；模块可发布为 npm 包（如 `@nuxtjs/axios`），插件通常项目内使用。 ## 追问 - 模块的执行时机为什么比插件早？如果插件需要修改 Nuxt 配置怎么办？ - `modules` 数组中的顺序会影响什么？多个模块冲突如何处理...
- Nuxt.js 应用性能优化有哪些关键手段？Nuxt 性能优化分三层：构建层利用 Nitro 做 payload 提取，将 SSR 数据抽到独立 JSON 避免重复内联；渲染层通过 routeRules 按Route规则混合 SSR/SSG/SPA，静态页面用 prerender 避免运行时渲染开销；资源层用 @nuxt/image 自动生成响应式 srcset 和 WebP 格式，LazyHydrate 延迟水合非首屏组件。此外 Nuxt 3 基于 Vite 的按需编译和 tree-shaking 本身就比 Nuxt 2 的 Webpack 产物更小。 ## 追问 - payload extraction 具体做了什么？对 ...
- Nuxt 3 有哪些数据获取方式？useFetch 和 useAsyncData 怎么选？Nuxt 3 提供两个核心组合式函数：useFetch 和 useAsyncData。useFetch 是 useAsyncData + $fetch 的语法糖，99% 场景用 useFetch 即可；useAsyncData 适合需要自定义获取逻辑（如依赖多个 API 聚合数据）的场景。两者都在 SSR 时于服务端执行，结果序列化到 payload 中供客户端 hydration 复用，避免重复请求。底层 HTTP 客户端是 ofetch（$fetch），支持服务端直接调用，无跨域问题。 ## 追问 - useFetch 的 key 是干什么用的？不写会怎样？ - SSR 时数据怎...
- Nuxt.js 和普通 Vue 应用有什么区别？Nuxt.js 是基于 Vue 的全栈框架，核心区别在于：普通 Vue 是纯客户端渲染 SPA，需要手动配置 Vue Router、Pinia、Vite 等生态；Nuxt 内置了 SSR/SSG/SPA 三种渲染模式、基于 pages/ 目录的文件路由、组件和组合式函数的自动导入、server/api 目录的 BaaS 风格服务端路由，以及 Nitro 服务引擎。普通 Vue 应用首屏为空壳 HTML，SEO 差；Nuxt 默认 SSR 可输出完整 HTML，对 SEO 和首屏性能更友好。 ## 追问 - Nuxt 3 的自动导入是怎么实现的？和手动 import 有什么性能差异？ ...
- 获得 0 次点赞
- 内容获得 0 次评论
- 获得 0 次收藏