将参数从v-for传递到动态更新b-tab标题。
提问于 2019-10-06 13:46:32
使用vuejs仅6周，根本就没有看过组件，如果这是个愚蠢的问题，很抱歉。
我试图在v-for循环中动态更新来自引导-vue的选项卡的b-旋转器组件，并将参数从v-传递到计算属性。
它在没有v-for的情况下工作很好。
<b-tab>
<template v-slot:title>
<b-spinner type="border" small v-show="!updateDone"></b-spinner> <strong>Tab Title</strong>
</template>
...
</b-tab>但是当我试图从v传递player属性时，它就会中断。当我试图将player传递给标题槽时，整个父组件将被传递。
<b-tab :key="player['player-id']" v-for="player in updatePool">
<template v-slot:title="{player}">
<b-spinner type="border" small v-show="!updateDone(player)"></b-spinner> <strong>{{player['player-name']}}</strong>
</template>
...
</b-tab>updateDone是一个计算属性，如下所示：
updateDone: function (player) {
return _.every(Object.values(this.someObject[player['player-name']]), Boolean)
},但是updateDone从不返回b/c player是一个完整的Vue对象(想必是父组件)
希望能对此有所了解。
安东尼奥的解决方案
<b-tab v-for="player in updatePickPool" :key="player['player-id']">
<template v-slot:title>
<b-spinner type="border" small v-show="!playerPathComplete(player)"></b-spinner><strong> {{player['player-name']}}</strong>
</template>
...
</b-tab>
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-10-06 14:40:18
根据您的评论，我意识到updateDone是一个computed属性。
在这种情况下，不要使用computed属性。
您必须使用method而不是computed属性。
为什么？ computed属性只有在依赖项发生变化时才会被缓存和更改。在您的示例中，在循环呈现选项卡时，player中没有任何更改。这意味着它将显示updateDone属性的相同结果。:(
但是一种方法每次被调用时都会进行评估。:)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58261485
复制
腾讯云开发者
