注册
登录
Vue
我可以在Vue.Js的计算属性中传递参数吗
返回
我可以在Vue.Js的计算属性中传递参数吗
作者:
狗头军师
发布时间:
2025-07-09 08:29:28 (5小时前)
<p>这有可能在Vue.Js中的计算属性中传递参数。我可以看到在使用getters / setter进行计算时，他们可以采用参数并将其分配给变量。就像这里的文档：<br/><code> // ... computed: { fullName: { // getter get: function () { return this.firstName + ' ' + this.lastName }, // setter set: function (newValue) { var names = newValue.split(' ') this.firstName = names[0] this.lastName = names[names.length - 1] } } } // ... </code></p><p>这也是可能的：</p> <pre><code>// ... computed: { fullName: function (salut) { return salut + ' ' + this.firstName + ' ' + this.lastName } } // ... </code></pre><p>其中，calculated属性接受一个参数并返回所需的输出。但是，当我尝试此操作时，出现此错误：</p><p>vue.common.js：2250未捕获的TypeError：fullName不是函数（…）</p><p>我应该在这种情况下使用方法吗？</p>
收藏
举报
2 条回复
1#
回复此人
v-star*위위
|
2020-08-04 17-48
您最有可能想要使用一种方法 ``` <span>{{ fullName('Hi') }}</span> methods: { fullName(salut) { return `${salut} ${this.firstName} ${this.lastName}` } } ``` 更长的解释 从技术上讲，您可以将计算属性与如下参数一起使用： ``` computed: { fullName() { return salut => `${salut} ${this.firstName} ${this.lastName}` } } ``` （Unirgy为此感谢基本代码。） 计算属性和方法之间的区别在于，计算属性将被缓存并仅在其依赖项更改时更改。一个方法将在每次调用时求值。 如果需要参数，在这种情况下，使用计算属性函数比使用方法通常没有任何好处。尽管它允许您将参数化的getter函数绑定到Vue实例，但是您会丢失缓存，因此实际上并没有任何收获，实际上，您可能会破坏反应性（AFAIU）。您可以在Vue文档https://vuejs.org/v2/guide/computed.html#Computed-Caching-vs-Methods中阅读有关此内容的更多信息。 唯一有用的情况是必须使用吸气剂并对其进行参数设置。例如，这种情况发生在Vuex中。在Vuex中，这是从存储区同步获取参数化结果的唯一方法（动作是异步的）。因此，Vuex官方文档为其吸气剂列出了该方法 https://vuex.vuejs.org/guide/getters.html#method-style-access
编辑
登录
后才能参与评论
