Vue-05

计算属性:用来处理复杂逻辑操作的
在Vue.js中有了计算属性这种方法,可以避免在模板中加入过度的业务逻辑,保证更好的结构清晰和后期维护的效率
例:将Hello World改成World=Hello的格式
在new Vue中的数据

data:{
        msg:"Hello World"
}

使用api,在h5标签里改为World=Hello的格式

<h5>{{msg.split(" ").reverse().join("=")}}</h5>

先将"Hello World"通过空格部分分割成"Hello"和"World"两个字符串,然后将两个字符串调换位置,最后用连接符“=”连接
但是使用这种方法的情况下,如果使用次数较多,则不便于后期的维护,因此用计算属性可以起到更好的作用

computed:{
        revMsg:function(){
                return this.msg.split(" ").reverse().join("=")
        }
}

这种方法更便于维护,要修改的只是computed中的数据

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第2章 基本语法 2.1 概述 基本句法和变量 语句 JavaScript程序的执行单位为行(line),也就是一...
    悟名先生阅读 4,221评论 0 13
  • 这篇笔记主要包含 Vue 2 不同于 Vue 1 或者特有的内容,还有我对于 Vue 1.0 印象不深的内容。关于...
    云之外阅读 5,086评论 0 29
  • 目录 上一章:第二十二章 鱼死网破 下一章:第二十四章 何为正义(完结篇) 第二十三章 千钧一发 寒若冰的脸霎时白...
    打呼的蕾蕾阅读 297评论 0 1
  • 天色渐渐的暗了下来,这繁华都市的霓虹灯并没有因为人的心情而发生丝毫的改变,来来往往的人群都低着头急匆匆的往家赶。一...
    城市屋檐下阅读 319评论 0 2
  • 时间过得好快,转眼四季已剩三季。也许因为北京并不是个四季分明的城市,所以才总觉得时不时的就错乱了。最近也不知道怎么...
    依诺2008阅读 122评论 0 0