<body>
<div id="app">
<h2>{
{
fullSentence}}</h2>
</div>
<script src="../JS/vue.js"></script>
<script>
const app = new Vue({
el:'#app',
data:{
firstName:'Kobe',
lastName:'Beyant'
},
computed:{
// fullSentence:function(){
// return this.message + ' ' + this.lastName;
// }
// 以上写法实质上是如下书写的简写形式
// 一般只需要实现get方法
// 而没有set方法，是一个 只读属性
fullSentence:{
set:function(newValue){
// console.log('------',newValue);
const names = newValue.split(' ');
this.firstName = names[0];
this.lastName = names[1];
},
get:function(){
return this.firstName + ' ' + this.lastName;
}
}
}
})
</script>
</body>
简写方式由来：
即将标准写法的set和get都取消， fullSentence方法名用来代替get函数名字，即可更加简略，但是其实质还是一个属性，而不是函数。