Только около 6 недель на использование vuejs и вообще не рассматривал компоненты, поэтому извините, если это глупый вопрос.
Я пытаюсь сделать компонент b-spinner для вкладок от bootstrap-vue динамически обновляется в цикле v-for, с параметром v-for, проходящим к вычисляемому свойству.
Работает нормально, если не в 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-for, оно ломается. Когда я пытаюсь передать 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>