什么是計算屬性：
在模板內的表達式非常便利，但是設計它們的初衷是用于簡單運算的洞拨。在模板中放入太多的邏輯會讓模板過重且難以維護扯罐，所以，對于任何復雜邏輯烦衣，你都應當使用計算屬性歹河。
計算屬性和方法區(qū)別：
盡管使用方法也能實現(xiàn)計算屬性相同效果，但最明顯的區(qū)別在于：計算屬性是基于它們的依賴進行緩存的花吟，只有相關依賴發(fā)生改變時它們才會重新求值秸歧。
案例：
<template>
<div>
{{messageCmp}} <br/>
<button @click="mclick">點擊</button> <br/> <br/>
{{message2Cmp}}
</div>
</template>
<script>
export default {
data(){
return {
message: '123,456,789'
}
},
// 計算屬性
computed: {
messageCmp(){
console.log('messageCmp 被執(zhí)行!');
return this.message.split(',').reverse().join(','); //反轉message值
},
// 提供 get set方法
message2Cmp: {
get(){
console.log('message2Cmp get被執(zhí)行!');
return this.message2 += ' hello';
},
set(val){
console.log('message2Cmp set被執(zhí)行!');
this.message = val;
}
}
},
methods: {
mclick(){
this.message = 'aa,bb,cc';
this.message2Cmp = 'hello message2';
console.log(this.message2Cmp );
}
}
mounted(){}
}
</script>
一般情況下，計算屬性不會使用到set衅澈，直接默認get ( messageCmp )方式返回處理后的值键菱。
