vue的计算属性

1、什么是计算属性

  • 写在computed对象中的属性,本质上是一个方法,不过使用时依旧当属性来使用

2.什么时候使用计算属性 

  • 一个变量的值, 需要用另外变量计算而得来

3、计算属性的配置项

get():必须要写,该函数不接受参数
get()什么时候被调用?:当初次读取计算属性或者计算属性所依赖的数据发生变化时被调用,getter函数有一个返回值,该返回值就是计算属性的值
set():可选项,接受一个可选参数(计算属性被修改之后的值)
set()什么时候被调用?: 当计算属性被修改时被调用
get()和 set()中出现的this执向vm
 

4、计算属性的缓存 

计算属性是基于它们的依赖项的值结果进行缓存的,只要依赖的变量不变, 都直接从缓存取结果

计算属性整个过程 

当第一次调用get()之后,Vue实例身上会出现一个与计算属性同名的属性(我称为计算属性的缓存属性),该属性的值就是调用get()返回的值
当再次调用getter之后,Vue把getter返回的值赋值给这个缓存属性
缓存属性:因此当不是初次访问计算属性时且计算属性所依赖的数据没有发生变化时,Vue实际上用的是这个属性,而不是再次执行get()
原理:底层借助了Object.defineProperty方法提供的getter和setter
 


完整语法:
    computed: {
       // "计算属性名" (){},
        "计算属性名": {
            set(值){
 
            },
            get(){
                return 值
            }
        }

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值