Vue里面计算属性computed带参数的使用方式
warning:
这篇文章距离上次修改已过200天，其中的内容可能已经有所变动。
<template>
<div>
<p>Original message: "{{ message }}"</p>
<p>Computed reversed message: "{{ reversedMessage }}"</p>
</div>
</template>
<script>
export default {
data() {
return {
message: 'Hello'
}
},
computed: {
// 计算属性函数
reversedMessage() {
// `this` 指向 Vue 实例
return this.message.split('').reverse().join('');
}
}
}
</script>这个例子中，我们定义了一个计算属性 reversedMessage，它会将数据属性 message 反转字符然后展示出来。这个计算属性是依赖于 message 数据属性的变化而变化的，如果 message 没有发生改变，那么 reversedMessage 计算属性的值会被缓存起来，不会重新计算，这样可以提高性能。
评论已关闭