今天學習的computed他代表計算之後的屬性，computed和methos一樣，屬性裡面放的不是值，而是函式，但是computed的函式裡面一定要return一個值，代表計算之後的結果。

這邊範例做一個簡單的加法計算，a值加b值等於c值，c值使用computed來做計算：

<div id="app">
  <input type="number" v-model="a" />+
  <input type="number" v-model="b" />=
  <input type="number" v-model="c" />
</div>
<script>
const vm = new Vue({
  el:"#app",
  data:{
    a: 3,
    b: 5
  },
  computed:{
    c(){
      return parseInt(this.a, 10)+parseInt(this.b, 10);
    }
  }
})
</script>

computed會偵測綁定資料的改變來計算屬性的值，也就是範例的c值，所以當我們重新輸入a值或b值的input，因為使用v-model繫結讓data同步更新，進而使c值能重新計算後呈現於畫面中。
函式與methods一樣不要箭頭函式，因為this可能會變成不是指向Vue實例。

computed除了做為一個計算屬性的方法，還可以把它宣告為物件，裡面含有兩個方法：get() 與 set()，情境延續上個範例：

但這邊除了要讓a或b輸入之後自動計算c值之外，還要讓我輸入c值時a值不動，自動計算b值應該為多少這個算式才會成立：

  computed:{
    c:{
      get(){
        return parseInt(this.a, 10)+parseInt(this.b, 10);
      },
      set(val){
        this.b = parseInt(val,10) - parseInt(this.a, 10);
      }
    }

get與set的解釋，以Vue的角度來說應該為：

• get：取用屬性的值；當繫結的資料改變時會觸發。
• set：設定屬性的值；當屬性的值改變時會觸發。

因此在範例中，當改變cinput的值時，觸發了set函式，並傳入改變的值val做後續的計算，最後得到b值。
而不宣告成物件預設就是只定義get函式了(如同此篇範例一)，可以依照實際需求選擇定義get或set函式。

以上為computed屬性的理解，如果內容有任何錯誤，還請大大們指正，謝謝
下篇開始學習watch