<!--
计算属性:
1. 定义:要用的属性不存在,要通过已有的属性计算得来
2. 原理:底层借助了 Object.defineProperty 方法提供的 getter 和 setter
3. get 函数什么时候执行?
(1). 初次读取时会执行一次
(2). 当依赖的数据发生改变时会被再次调用
4. 优势:与 methods 实现相比,内部有缓存机制(复用),效率高,调试方便
5. 备注:
1. 计算属性最终会出现在 vm 上,直接读取使用即可
2. 如果计算属性要被修改,那必须写在 set 函数去响应修改,且 set 中要引起计算时依赖的数据发生改变
-->
<div id="root">
<ul>
<li>姓:<input type="text" v-model="firstName"></li>
<li>名:<input type="text" v-model="lastName"></li>
<li>全名:{
{getFullName}}</li>
<li>全名:{
{getFullName}}</li>
<li>全名:{
{getFullName}}</li>
Vue 计算属性 computed
最新推荐文章于 2024-08-19 18:25:12 发布
本文深入探讨 Vue.js 的计算属性 `computed`,介绍其工作原理和使用场景。通过实例,展示如何利用 `computed` 实现数据的动态计算,提升 Vue 应用的性能和代码组织效率。
摘要由CSDN通过智能技术生成