Vue
文章平均质量分 81
Vue相关技术
ChinaDragonDreamer
追梦莫空动!
个人公众号:小龙知识库
展开
-
Vue:表单输入绑定
v-model 在内部为不同的输入元素使用不同的 property 并抛出不同的事件:text 和 textarea 元素使用 value property 和 input 事件;checkbox 和 radio 使用 checked property 和 change 事件;select 字段将 value 作为 prop 并将 change 作为事件。原创 2024-06-03 11:24:17 · 380 阅读 · 0 评论 -
Vue:事件处理
可以用 v-on 指令监听 DOM 事件,并在触发时运行一些 JavaScript 代码。然而许多事件处理逻辑会更为复杂,所以直接把 JavaScript 代码写在 v-on 指令中是不可行的。因此 v-on 还可以接收一个需要调用的方法名称。原创 2024-06-03 09:26:25 · 603 阅读 · 0 评论 -
Vue:列表渲染
我们可以用 v-for 指令基于一个数组来渲染一个列表。v-for 指令需要使用 item in items 形式的特殊语法,其中 items 是源数据数组,而 item 则是被迭代的数组元素的别名。在自定义组件上,你可以像在任何普通元素上一样使用 v-for。提醒: 2.2.0+ 的版本里,当在组件上使用 v-for 时,key 现在是必须的。原创 2024-06-01 19:06:08 · 504 阅读 · 0 评论 -
Vue:条件渲染
v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做——直到条件第一次变为真时,才会开始渲染条件块。相比之下,v-show 就简单得多——不管初始条件是什么,元素总是会被渲染,并且只是简单地基于 CSS 进行切换。v-if 有更高的切换开销,而 v-show 有更高的初始渲染开销。如果需要非常频繁地切换,则使用 v-show 较好;如果在运行时条件很少改变,则使用 v-if 较好原创 2024-06-01 15:21:57 · 788 阅读 · 0 评论 -
Vue:Class 与 Style 绑定
操作元素的 class 列表和内联样式是数据绑定的一个常见需求。因为它们都是 attribute,所以我们可以用 v-bind 处理它们:只需要通过表达式计算出字符串结果即可。不过,字符串拼接麻烦且易错。因此,在将 v-bind 用于 class 和 style 时,Vue.js 做了专门的增强。表达式结果的类型除了字符串之外,还可以是对象或数组。原创 2024-05-31 21:19:43 · 896 阅读 · 0 评论 -
Vue:计算属性和侦听器
计算属性是基于它们的响应式依赖进行缓存的。只在相关响应式依赖发生改变时它们才会重新求值。这就意味着只要 message 还没有发生改变,多次访问 reversedMessage 计算属性会立即返回之前的计算结果,而不必再次执行函数。Vue 通过 watch 选项提供了一个更通用的方法,来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时,这个方式是最有用的。原创 2024-05-31 17:44:24 · 833 阅读 · 0 评论 -
Vue:模板语法-指令和缩写
指令 (Directives) 是带有 v- 前缀的特殊 attribute。指令 attribute 的值预期是单个 JavaScript 表达式 (v-for 是例外情况,稍后我们再讨论)。指令的职责是,当表达式的值改变时,将其产生的连带影响,响应式地作用于 DOM。原创 2024-05-30 20:46:08 · 652 阅读 · 0 评论 -
Vue:模板语法-插值
Vue.js 使用了基于 HTML 的模板语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML,所以能被遵循规范的浏览器和 HTML 解析器解析。在底层的实现上,Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统,Vue 能够智能地计算出最少需要重新渲染多少组件,并把 DOM 操作次数减到最少。原创 2024-05-30 20:01:36 · 794 阅读 · 0 评论 -
Vue:实例生命周期钩子
每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数,这给了用户在不同阶段添加自己的代码的机会。比如 created 钩子可以用来在一个实例被创建之后执行代码:原创 2024-05-29 17:40:02 · 795 阅读 · 1 评论 -
Vue 实例
每个 Vue 应用都是通过用 Vue 函数创建一个新的 Vue 实例开始的:虽然没有完全遵循 MVVM 模型,但是 Vue 的设计也受到了它的启发。因此在文档中经常会使用 vm (ViewModel 的缩写) 这个变量名表示 Vue 实例。当创建一个 Vue 实例时,你可以传入一个选项对象。这篇教程主要描述的就是如何使用这些选项来创建你想要的行为。作为参考,你也可以在 API 文档中浏览完整的选项列表。一个 Vue 应用由一个通过 new Vue 创建的根 Vue 实例,以及可选的嵌套的、可复用的原创 2024-05-29 16:56:29 · 358 阅读 · 1 评论 -
Vue:快速上手
Vue是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建,并提供了一套声明式的、组件化的编程模型,帮助你高效地开发用户界面。无论是简单还是复杂的界面,Vue 都可以胜任。原创 2024-05-28 22:28:09 · 341 阅读 · 0 评论 -
Vue教程
vue教程原创 2023-09-06 15:00:19 · 219 阅读 · 0 评论