上篇部落格，隻用了computed的get方法，擷取計算屬性的值。set方法為給計算屬性指派時執行的方法
<!DOCTYPE html>
<html lang=en>
<head>
<meta charset="utf-8" />
<title>Hello world</title>
<script src="vue.js"></script>
</head>
<body>
<div id="root">
{{fullName}}
</div>
<script>
var vm = new Vue({
el: "#root",
data: {
firstName: "xu",
lastName: "haixing"
},
computed: {
fullName: {
get: function () {
return this.firstName + " " + this.lastName;
},
set: function (value) {
var arr = value.split(" ");
this.firstName = arr[0];
this.lastName = arr[1];
console.log("value" + value);
}
}
}
})
</script>
</body>
</html> 例子中，firstName與lastName改變會計算fullName值，fullName改變也會計算fistName與lastName值。看示範效果：
![Vue項目 - 單檔案元件和Vue中的路由[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)