云川

摘要： 介绍 <Transition> 是一个内置组件，这意味着它在任意别的组件中都可以被使用，无需注册。它可以将进入和离开动画应用到通过默认插槽传递给它的元素或组件上。进入或离开可以由以下的条件之一触发： 由 v-if 所触发的切换 由 v-show 所触发的切换 由特殊元素 切换的动态组件 改变特殊的 阅读全文

摘要： 介绍​ 插件 (Plugins) 是一种能为 Vue 添加全局功能的工具代码。下面是如何安装一个插件的示例 import { createApp } from 'vue' const app = createApp({}) app.use(myPlugin, { /* 可选的选项 */ }) 一个插 阅读全文

摘要： 介绍​ 除了 Vue 内置的一系列指令 (比如 v-model 或 v-show) 之外，Vue 还允许你注册自定义的指令 (Custom Directives)。 我们已经介绍了两种在 Vue 中重用代码的方式：组件和组合式函数。组件是主要的构建模块，而组合式函数则侧重于有状态的逻辑。另一方面，自 阅读全文

摘要： 什么是“组合式函数”？ 在 Vue 应用的概念中，“组合式函数”(Composables) 是一个利用 Vue 的组合式 API 来封装和复用有状态逻辑的函数。类似与vue2中mixin（混入） 当构建前端应用时，我们常常需要复用公共任务的逻辑。例如为了在不同地方格式化时间，我们可能会抽取一个可复用 阅读全文

摘要： 基本用法​ 在大型项目中，我们可能需要拆分应用为更小的块，并仅在需要时再从服务器加载相关组件。Vue 提供了 defineAsyncComponent 方法来实现此功能： import { defineAsyncComponent } from 'vue' const AsyncComp = def 阅读全文

摘要： 解决的问题 祖孙组件传值 Provide (提供) 要为组件后代提供数据，需要使用到 provide() 函数： <script setup> import { provide } from 'vue' provide(/* 注入名 */ 'message', /* 值 */ 'hello!') < 阅读全文

摘要： 原理 当使用在一个组件上时，v-model 会被展开为如下的形式： <CustomInput :model-value="searchText" @update:model-value="newValue => searchText = newValue" /> 要让这个例子实际工作起来，<Cust 阅读全文

摘要： 单向数据流 所有的 props 都遵循着单向绑定原则，props 因父组件的更新而变化，自然地将新的状态向下流往子组件，而不会逆向传递。这避免了子组件意外修改父组件的状态的情况，不然应用的数据流将很容易变得混乱而难以理解。 另外，每次父组件更新后，所有的子组件中的 props 都会被更新到最新值，这 阅读全文

摘要： 菜单栏控制 实现思路 一般是后端返回菜单栏数组，前端根据数组动态创建菜单栏，这里以fe-backend-archive项目为例。使用elementui的 el-menu ，以及组件的递归调用，动态渲染菜单栏。 <el-menu :default-active="defaultActive" back 阅读全文

摘要： 简介 Vue 的两个核心功能： 声明式渲染：Vue 基于标准 HTML 拓展了一套模板语法，使得我们可以声明式地描述最终输出的 HTML 和 JavaScript 状态之间的关系。 响应性：Vue 会自动跟踪 JavaScript 状态并在其发生变化时响应式地更新 DOM。 API 风格 Vue 的 阅读全文