摘要：引用：https://www.ruanyifeng.com/blog/2020/12/fetch-tutorial.html fetch()是 XMLHttpRequest 的升级版，用于在 JavaScript 脚本里面发出 HTTP 请求。 浏览器原生提供这个对象。本文详细介绍它的用法。 一、基 阅读全文

摘要：使用 Fetch Fetch API 提供了一个 JavaScript 接口，用于访问和操纵 HTTP 管道的一些具体部分，例如请求和响应。它还提供了一个全局 fetch() 方法，该方法提供了一种简单，合理的方式来跨网络异步获取资源。 这种功能以前是使用 XMLHttpRequest 实现的。Fe 阅读全文

摘要：搭配 TypeScript 使用 Vue 像 TypeScript 这样的类型系统可以在编译时通过静态分析检测出很多常见错误。这减少了生产环境中的运行时错误，也让我们在重构大型项目的时候更有信心。通过 IDE 中基于类型的自动补全，TypeScript 还改善了开发体验和效率。 Vue 本身就是用 阅读全文

摘要：IDE 支持 强烈推荐 Visual Studio Code (VSCode)，因为它对 TypeScript 有着很好的内置支持。 Volar 是官方的 VSCode 扩展，提供了 Vue 单文件组件中的 TypeScript 支持，还伴随着一些其他非常棒的特性。 TypeScript Vue P 阅读全文

摘要：1.Uncaught SyntaxError: The requested module '/node_modules/.vite/vue-router.js?v=4b09f9b8' does not provide an export named 'default' 【解决】 vue-router 阅读全文

摘要：安装 npm install vue-router@4 yarn add vue-router@4 一、配置路由，新建 \router\index.js 路由文件 import { createRouter, createWebHashHistory } from 'vue-router/dist/ 阅读全文

摘要：安装 1. 安装 pinia 库 yarn add pinia # 或者使用 npm npm install pinia 2. 在main.js 中导入 pinia 并使用 import { createApp } from 'vue' import { createPinia } from 'pi 阅读全文

摘要：查看Vue 版本 npm view vue version 阅读全文

摘要：注册组件 一个 Vue 组件在使用前需要先被“注册”，这样 Vue 才能在渲染模板时找到其对应的实现。组件注册有两种方式：全局注册和局部注册。 全局注册 更改 main.js 文件如下： import { createApp } from 'vue' import App from './App.v 阅读全文

摘要：组件基础 组件允许我们将 UI 划分为独立的、可重用的部分，并且可以对每个部分进行单独的思考。在实际应用中，组件常常被组织成层层嵌套的树状结构： Vue 实现了自己的组件模型，使我们可以在每个组件内封装自定义内容与逻辑。 定义一个组件 当使用构建步骤时，我们一般会将 Vue 组件定义在一个单独的 . 阅读全文

摘要：虽然 Vue 的声明性渲染模型为你抽象了大部分对 DOM 的直接操作，但在某些情况下，我们仍然需要直接访问底层 DOM 元素。要实现这一点，我们可以使用特殊的 ref attribute： 访问模板引用# 为了通过组合式 API 获得该模板引用，我们需要声明一个同名的 ref： <script se 阅读全文

摘要：侦听器 计算属性允许我们声明性地计算衍生值。然而在有些情况下，我们需要在状态变化时执行一些“副作用”：例如更改 DOM，或是根据异步操作的结果去修改另一处的状态。 在组合式 API 中，我们可以使用 watch 函数在每次响应式状态发生变化时触发回调函数： 以下代码侦听question 变量，当qu 阅读全文

摘要：表单输入绑定 v-model 还可以用于各种不同类型的输入，<textarea>、<select> 元素。它会根据所使用的元素自动使用对应的 DOM 属性和事件组合： 文本类型的 <input> 和 <textarea> 元素会绑定 value property 并侦听 input 事件； <inp 阅读全文

摘要：监听事件# 我们可以使用 v-on 指令 (简写为 @) 来监听 DOM 事件，并在事件触发时执行对应的 JavaScript。用法：v-on:click="methodName" 或 @click="handler"。 事件处理器的值可以是： 内联事件处理器：事件被触发时执行的内联 JavaScr 阅读全文

摘要：v-if v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回真值时才被渲染。 <button @click="awesome = !awesome">Toggle</button> <h1 v-if="awesome">Vue is awesome!</h1> <h1 v-els 阅读全文

摘要：Class 与 Style 绑定 数据绑定的一个常见需求场景是操纵元素的 CSS class 列表和内联样式 因为 class 和 style 都是 attribute，我们可以和其他 attribute 一样使用 v-bind 将它们和动态的字符串绑定。 Vue 专门为 class 和 style 阅读全文

摘要：计算属性 推荐使用计算属性来描述依赖响应式状态的复杂逻辑 <script setup> import { reactive, computed } from 'vue' const author = reactive({ name: 'John Doe', books: [ 'Vue 2 - Adv 阅读全文

摘要：响应式基础 使用 reactive() 函数创建一个响应式对象或数组： <script setup> import { reactive } from 'vue' const state = reactive({ count: 0 }) function increment() { state.co 阅读全文

摘要：模板语法 Vue 使用一种基于 HTML 的模板语法，使我们能够声明式地将其组件实例的数据绑定到呈现的 DOM 上。所有的 Vue 模板都是语法层面合法的 HTML，可以被符合规范的浏览器和 HTML 解析器解析。 在底层机制中，Vue 会将模板编译成高度优化的 JavaScript 代码。结合响应 阅读全文

摘要：创建单文件组件式API 安装 Node.js https://nodejs.org/en/ 在本地搭建 Vue 单页应用。创建的项目将使用基于 Vite 的构建设置，并允许我们使用 Vue 的单文件组件 (SFC)。 确保你安装了最新版本的 Node.js，然后在命令行中运行以下命令 (不要带上 > 阅读全文