在使用计算属性的时候,会通过this.xxx来引用this中的数据,还有一种更好的方式来引用this中的数据
//模版代码
<template>
<div class="container">
{{totalValue}}
</div>
</template>
//data中的数据
data(){
return {
age:10,
name:'tom',
bodyHeight: '175',
bodyWeight: '70'
}
},
常规操作--不推荐
totalValue(){
return '年龄是:' + this.age +
'姓名是:' + this.name +
'身高是:' + this.bodyHeight +
'体重是:' + this.bodyWeight
}
优雅版
computed:{
totalValue({age,name,bodyHeight,bodyWeight}){
return '年龄是:' + age + '姓名是:' + name + '身高是:' + bodyHeight + '体重是:' + bodyWeight
}
}
向计算属性传递参数,参数对应着data中的数据。
实际结果:
👍👍👍