计算属性

计算属性

基础用法

var vm = new Vue({
	el: '#app',
	data: {
		firstName: 'Gavin'
		lastName: 'CLY'
	}
	computed: {
		fullName: function() {
			// this 指向 vm 实例
			return this.firstName + ' ' + this.lastName
		}
	}
});

HTML 代码:

<p>{{ firstName }}</p> // Gavin
<p>{{ lastName }}</p> // CLY
<p>{{ fullName }}</p> // Gavin CLY

Setter 用法

var vm = new Vue({
	el: '#el',
	
	data: {
		cents: 100
	}

	computed: {
		price: {
			set: function(newValue) {
				this.cents = newValue * 100;
			},
			get: function() {
				return (this.cents / 100).toFixed(2);
			}
		}
	}
})