computed 的英文意思是計算，那麼顧名思義，vue中的computed也與計算有關，他是專門用來處理複雜表示式的，在vue中，不建議在模板語法中寫複雜的表示式，如：x+y+(z-1) 這種，所以vue建了一個computed用來處理這類表示式，使用方法其實也不難，在computed裡面建一個函式並寫表示式，然後在想要引用的地方將之當成data裡的值引用即可，例如想要在模板語法裡面用，只需要寫函式名即可，並且不用加括號，具體例子如下：

data中定義三個值：

data(){
    return{
        num1: 10,
        num2: 20,
        nums: 
 
5
    }
},

然後在computed中寫一條表示式：

computed:{ //計算函式，複雜的計算都應該放在這裡，儘量不要直接在模板語法裡面計算，在此處計算的值是會動態變的，即計算的數中有一個值變了，最終結果也會跟著變，類似於封裝的計算函式
    addNum:function(){ //addnum可以直接在模板語法裡面用，相當於data內的值
        return Number(this.nums) + Number(this.num1) + Number(this.num2);
    }
},

之後在模板語法中應用

<div>{{addNum}}</div> //addNum即為定義的表示式

看下效果：

可以看到按鈕中顯示出了表示式的值

如果表示式內參數的值變化的話最終的值也是會跟著變的