首页
AI Coding
数据标注
NEW
沸点
课程
直播
活动
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
登录
注册
vue3
河北小田
创建于2024-06-28
订阅专栏
渐进式 JavaScript 框架, 易学易用,性能出色,适用场景丰富的 Web 前端框架。
等 4 人订阅
共60篇文章
创建于2024-06-28
订阅专栏
默认顺序
默认顺序
最早发布
最新发布
十八、组件事件
一、触发与监听事件 在组件的模板表达式中,可以直接使用 $emit 方法触发自定义事件 (例如:在 v-on 的处理函数中): 父组件可以通过 v-on (缩写为 @) 来监听事件: 同样,组件的事件
十七、Props
一、Props 声明 一个组件需要显式声明它所接受的 props,这样 Vue 才能知道外部传入的哪些是 props,哪些是透传 attribute。 在使用 <script setup> 的单文件组
十、事件处理
一、监听事件 我们可以使用 v-on 指令 (简写为 @) 来监听 DOM 事件,并在事件触发时执行对应的 JavaScript。用法:v-on:click="handler" 或 @click="h
十六、组件注册
一个 Vue 组件在使用前需要先被“注册”,这样 Vue 才能在渲染模板时找到其对应的实现。组件注册有两种方式:全局注册和局部注册。 一、全局注册 我们可以使用 Vue 应用实例的 .componen
十五、组件基础
组件允许我们将 UI 划分为独立的、可重用的部分,并且可以对每个部分进行单独的思考。在实际应用中,组件常常被组织成层层嵌套的树状结构: 这和我们嵌套 HTML 元素的方式类似,Vue 实现了自己的组件
十四、模板引用
虽然 Vue 的声明性渲染模型为你抽象了大部分对 DOM 的直接操作,但在某些情况下,我们仍然需要直接访问底层 DOM 元素。要实现这一点,我们可以使用特殊的 ref attribute: ref 是
十三、侦听器
一、基本示例 计算属性允许我们声明性地计算衍生值。然而在有些情况下,我们需要在状态变化时执行一些“副作用”:例如更改 DOM,或是根据异步操作的结果去修改另一处的状态。 在组合式 API 中,我们可以
十二、生命周期
一、生命周期钩子 每个 Vue 组件实例在创建时都需要经历一系列的初始化步骤,比如设置好数据侦听,编译模板,挂载实例到 DOM,以及在数据改变时更新 DOM。在此过程中,它也会运行被称为生命周期钩子的
九、列表渲染
1、v-for 我们可以使用 v-for 指令基于一个数组来渲染一个列表。v-for 指令的值需要使用 item in items 形式的特殊语法,其中 items 是源数据的数组,而 item 是迭
八、条件渲染
1、v-if v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回真值时才被渲染。 2、v-else 你也可以使用 v-else 为 v-if 添加一个“else 区块”。 一个 v
七、Class 与 Style 绑定
数据绑定的一个常见需求场景是操纵元素的 CSS class 列表和内联样式。因为 class 和 style 都是 attribute,我们可以和其他 attribute 一样使用 v-bind 将它
六、计算属性
一、基础示例 模板中的表达式虽然方便,但也只能用来做简单的操作。如果在模板中写太多逻辑,会让模板变得臃肿,难以维护。比如说,我们有这样一个包含嵌套数组的对象: 我们想根据 author 是否已有一些书
四、模板语法-下
一、使用 JavaScript 表达式 至此,我们仅在模板中绑定了一些简单的属性名。但是 Vue 实际上在所有的数据绑定中都支持完整的 JavaScript 表达式: 这些表达式都会被作为 JavaS
四、模板语法-上
Vue 使用一种基于 HTML 的模板语法,使我们能够声明式地将其组件实例的数据绑定到呈现的 DOM 上。所有的 Vue 模板都是语法层面合法的 HTML,可以被符合规范的浏览器和 HTML 解析器解
五、响应式基础-额外的 ref 解包细节-下
一、作为 reactive 对象的属性 一个 ref 会在作为响应式对象的属性被访问或修改时自动解包。换句话说,它的行为就像一个普通的属性: 如果将一个新的 ref 赋值给一个关联了已有 ref 的属
五、响应式基础-reactive()-中
另一种声明响应式状态的方式,即使用 reactive() API。与将内部值包装在特殊对象中的 ref 不同,reactive() 将使对象本身具有响应性: 在模板中使用: 响应式对象是 JavaSc
五、响应式基础-声明响应式状态-上
一、ref() 在组合式 API 中,推荐使用 ref() 函数来声明响应式状态: ref() 接收参数,并将其包裹在一个带有 .value 属性的 ref 对象中返回: 要在组件模板中访问 ref,
三、创建一个 Vue 应用
一、应用实例 每个 Vue 应用都是通过 createApp 函数创建一个新的 应用实例: 二、根组件 我们传入 createApp 的对象实际上是一个组件,每个应用都需要一个“根组件”,其他组件将作
二、快速上手vue3.0
一、创建一个 vue 应用 创建的项目将使用基于 Vite 的构建设置,并允许我们使用 Vue 的单文件组件 (SFC)。 1、创建命令 或 或 或 然后一路next... 2、安装依赖 或 或 或
一、初始vue3.0
一、优势: 易学易用:基于标准 HTML、CSS 和 JavaScript 构建,提供容易上手的 API 和一流的文档。 性能出色:经过编译器优化、完全响应式的渲染系统,几乎不需要手动优化。 灵活多变