vue中计算属性computed简单使用与传递参数
<template>
<div>
<!-- 使用计算属性显示信息 -->
<p>姓名：{{ fullName }}</p>
</div>
</template>
<script>
export default {
data() {
return {
firstName: '张',
lastName: '三'
};
},
computed: {
// 计算属性定义方法，不带括号
fullName() {
// 返回计算后的数据
return `${this.firstName} ${this.lastName}`;
}
}
};
</script>这个例子中，我们定义了一个计算属性fullName，它会根据data中的firstName和lastName自动计算并返回全名。在模板中，我们直接使用{{ fullName }}来显示计算后的结果。这是计算属性的基本用法。
评论已关闭