在Vue中，computed屬性是一個非常重要的概念，它提供了一種方便的方式來實時計算和變換屬性的值。當computed屬性依賴于其他屬性時，那么當這些屬性改變時，computed屬性的值會自動更新。

<div id="app">
<p>{{ message }}</p>
<p>{{ computedMessage }}</p>
</div>
<script>
var vm = new Vue({
el: '#app',
data: {
message: 'Hello Vue.js!'
},
computed: {
computedMessage: function() {
return this.message.split('').reverse().join('')
}
}
})
</script>

在上面的例子中，我們定義了一個computed屬性 computedMessage，它依賴于一個data中的屬性 message。當message屬性發生變化時，computedMessage屬性也會自動更新。

computed屬性的實現原理是Vue使用了一種叫做“訪問器屬性”的特殊對象屬性，通過這種方式自動依賴追蹤，并且可以緩存計算結果。

當我們定義一個computed屬性時，Vue會將它轉換為一個訪問器屬性，并且掛載到組件的原型對象上。這樣，在組件的實例上訪問這個computed屬性時，Vue會自動觸發計算函數，并且將計算結果返回。這個結果會被緩存起來，直到它依賴的屬性發生變化時，才會重新計算。

<script>
var vm = new Vue({
data: {
firstName: 'John',
lastName: 'Doe'
},
computed: {
fullName: {
get: function() {
return this.firstName + ' ' + this.lastName
},
set: function(value) {
var parts = value.split(' ')
this.firstName = parts[0]
this.lastName = parts[1]
}
}
},
methods: {
greet: function() {
alert('Hello ' + this.fullName + '!')
}
}
})
vm.fullName = 'Jane Doe'
vm.greet() // "Hello Jane Doe!"
</script>

在上面的例子中，我們定義了一個computed屬性 fullName，并同時定義了get和set方法。當我們訪問fullName時，會調用get方法，而當我們設置fullName時，會調用set方法。

總的來說，computed屬性在Vue中是一個非常強大的概念，可以很靈活地處理屬性之間的關系，并且能夠自動追蹤依賴。如果我們需要根據一個或多個屬性來計算或變換另一個屬性的值，那么computed屬性就是實現這個目標的最佳方式。