Vue 'computed' 選項
示例
在 computed 選項中使用計算屬性來顯示正確的按鈕文字。
export default {
data() {
return {
msg: 'Hello World!',
showMsg: false
};
},
computed: {
btnText() {
if( this.showMsg ) {
return 'Hide'
}
else {
return 'Show'
}
}
}
};
定義和用法
computed 選項是一個物件，包含在 Vue 例項上宣告的所有計算屬性。
計算屬性通常是隻讀的（請參閱上面的示例），但也可以將計算屬性定義為包含 get 和 set 函式的物件，這意味著計算屬性也可以被寫入。
注意： 宣告計算屬性時應避免使用箭頭函式，因為透過 this 關鍵字無法從函式內部訪問 Vue 例項。
相關頁面
Vue 教程：Vue Computed Properties
Vue 教程： Vue v-on 指令
