Question

我的一个父级成员有2个孩子（同一个孩子，但被两次叫过）。

//parent
<cards-box :allCards="allCards" />
<cards-box :allCards="selectedCards" />

如果我从第一个孩子中选择一张卡，则必须在第二个孩子中触发一个动作。但是从我看到的内容来看，子组件是否相同并不重要，每个子组件都有单独的变量。所以我必须将它从一个传递到另一个（即使是相同的组件）

<div class="removed" v-if="selectedCard" @click="removeCard(card.id)">
    <a href="#game-board" >Replace</a>
</div> //This will be trigger in one child
<div class="selected" v-if="!selectedCard" @click="addCardToBoardGame(card.id)">
    <a href="#game-board" >Select</a>
</div> //This one is the one that triggers the event


...methods
    addCardToBoardGame(value){ //the value is changed here
        this.selectedCard = value;
    },
    removeCard(id){
        this.removedCard = id;
        //selectedCard is null here
    }
...

此外，我尝试在更改值时发出eventBus，并让第二个标签传递该值，以获取更改后的值，但不起作用。

更新，已解决！

我找到了一种解决方案（很奇怪）。我从子组件发出一个eventBus，然后从那里监听并工作。但我愿意寻求更好的解决方案。

V-如果未触发，Vue.js

0 个答案: