计算属性

387 阅读1分钟

计算属性中可以重写setter,getter方法。但是有缓存。原则是vm不变界面不进行重新渲染,那么属性方法将不走,也就是用上次缓存。

<body>

	<div id="app">
<!--		计算属性get,setter方法(有缓存)-->
		<p>{{ message }}</p>
		<p>{{ message }}</p>
	</div>


	<script>
		var cnt = 1;
		var vm = new Vue({
			el: "#app",
			data:{
				name: '小明:',
				doing: '吃饭'
			},

			computed: {
				message:{
					get: function () {
						cnt++;
						return this.name + this.doing + cnt;
					},

					set: function (value) {
						this.name = '小李:';
						this.doing = '学习';
					}
				}
			}
		})

		vm.message = "haha";
	</script>
	
	</body>