import { useEffect, useState } from "react";const useFetch = (url = "", options = undefined) => { const [data
原创
2023-02-14 09:30:21
42阅读
对nuxt3中的useFetch封装成类似axios的封装，方便vue3项目移植到nuxt3，让useFetch的使用方式替换成axios的使用习惯
背景 新入职公司还处于交接中，最近一个海外的官网其他同事更新之后出现访问超时问题，部分超大的js下载不下来的问题，就尝试着想要优化一下。项目结构是 NUXT2.0+ Element UI，使用 NUXT的主要原因还是为了SEO优化，Vue在SEO上是弱项过程打算使用webpack打包 翻了翻NUXT的文档 发现这家伙其实还是基于Webpack打包的，于是乎就想和普通的VUE项目一般
前言Nuxt3 这个月刚出没多久，目前还在 beta 阶段，难以上生产环境。官方也推荐我们的 Nuxt2 项目，先迁移到 Nuxt Bridge 来进行一个平滑的过渡。不过我们还是有必要预先体会一下 Nuxt3 与 Nuxt2 之间的异同点，来为我们的项目预先累积一些迁移知识。Quick
1. Nuxt.js 概述1.1 我们一起做过的SPASPA（single page web application）单页 Web 应用，Web 不再是一张张页面，而是一个整体的应用，一个由路由系统、数据系统、页面（组件）系统等等，组成的应用程序。SPA 应用广泛用于对SEO要求不高的场景中1.2 什么是SEOSEO：搜索引擎优化（Search Engine Optimization）, 通过各种
一. 安装
pnpm dlx nuxi@latest init <project-name>
// or
npx nuxi@latest init <project-name>
如遇到报错
手动安装：
浏览器访问报错https请求地址：
点击tar(项目初始文件的下载地址)对应地址,下载starter-3.tar.gz 包到本地
本地创建项目文件，
前言 nuxt3 中获取后端数据总共有三个方法： useFetch() $fetch() useAsynData() 本篇教程就针对这三个方法的使用注意事项做一个记录 正文 通过useFetch()方法请求这个动作，在首次加载时，只在服务端执行一次，客户端是不执行得，客户端是直接使用拿到的数据地；
原创
2024-01-28 20:17:56
602阅读
前言大家好，我是村长，欢迎关注我的公众号村长学前端和B站Young村长上一篇写了数据获取的各种姿势，最终大意了没有闪，以至于pick部分举例欠妥：const { data: todos } = await useFetch("/api/todo", { pick: ["id", "title", "completed"],});导致了500错误，这里需要说明的是，pic
原创
2022-10-17 20:11:12
471阅读
在Nuxt3中封装网络请求可以帮助我们更好地管理和复用API调用。我们可以使用useFetch或$fetch来发起HTTP请求，并通过创建插件或组合式函数来封装这些请求。下面是一个简单的示例，展示如何在Nuxt3中封装网络请求：创建一个组合式函数来封装网络请求。在页面或其他组件中使用这个封装好的函数。首先，创建一个组合式函数文件 composables/useApi.js：接下来，在 nuxt.c
