Vue的computed屬性可以用于計算屬性，使得頁面渲染更為靈活和高效，也有利于開發者編寫出高質量的代碼。computed屬性可以根據已有的數據進行計算，然后返回新的數據，使得我們可以實現數據處理的自動化。

computed: {
totalPrice() {
return this.price * this.quantity
}
}

上述代碼中，我們定義了一個計算屬性totalPrice，它由price和quantity兩個屬性相乘得到。computed屬性會自動感知依賴關系，只有在它所依賴的數據發生變化時才會重新計算。

computed屬性的另一個使用場景是處理過濾和排序。例如，我們可以先在data中定義一組用戶數據：

data: {
users: [
{ name: 'Amy', age: 28 },
{ name: 'Bob', age: 34 },
{ name: 'Cathy', age: 19 },
{ name: 'David', age: 42 }
]
}

然后再定義一個計算屬性，用于篩選出年齡大于等于30歲的用戶：

computed: {
filteredUsers() {
return this.users.filter(user =>user.age >= 30)
}
}

在模板中，我們可以使用computed屬性來渲染篩選后的用戶信息：

<ul>
<li v-for="user in filteredUsers" :key="user.name">
{{ user.name }} ({{ user.age }})
</li>
</ul>

這樣我們就可以得到一個只顯示年齡大于等于30歲用戶信息的列表。