vue学习(三)计算属性全攻略

注意

计算属性除了简单的文本插值外,还经常用于动态地设置元素的样式名称class和内联样式 style

语法

方式一:computed:{

  b:function(){//默认调用get()

    return 值 // b属性的值完全取决于返回值

  }

}

注:b看起来像是函数,但实际上是属性 data和computed里面的都是数据,使用方式都一样,但是computed可以放置一些业务逻辑代码,一定记得return,计算属性的值取决于返回值

方式二:computed:{

  b:{

    get:function(){}  // 获取值时调用

    set:function(val){}  // 设置值时调用,val是设置的值

  }

}

注:set设置属性,并不是直接修改计算属性,而是修改它的依赖

参考

vue官网教程:计算属性

vue官网api:计算属性

Vue系列之computed使用详解(附demo,不定期更新)

vue 计算属性怎么传参

 

原文地址:https://www.cnblogs.com/kunmomo/p/12483726.html