Vue计算属性

Posted 2021-02-16 qingshanyici

一、计算属性

当表达式过长，或者逻辑更为复杂时，常常需要到计算属性。所有的计算属性都写在Vue实例内的computed选项内，最终返回计算后的结果。

<div id="app1">
        {{reversedText}} 
    </div>

 

var app1=new Vue({
    el:"#app1",
    data:{
        text:"123,456",
    },
    computed:{
        reversedText:function(){
            //this指向的是当前的Vue实例
            return this.text.split(",").reverse().join(",");
            //返回值：456,123
        }
    }
})

 

 

二、计算属性的用法