Vue js在三个组件之间发出吗?

问题描述 投票:0回答:2

我有一个Card组件,当单击该组件时会发出一个字符串,然后我的轮播组件会将由Card发出的字符串发回到其父对象。卡组件发射正常,但轮播组件无效。

发卡:

<div class="card m-0 p-0" @click="$emit('setMovie', movieKey)">

转盘上的发射:

<div class="carousel-item active">
     <div class="row ml-1">
         <h1>{{selectedMovie}}</h1>
         <MovieCard v-for="m in movies" :key="m.MovieKey" @setMovie="$emit('setMovie', movieKey)"/>                      
     </div>
</div>

家庭组件(未检测到轮播的发射):

<Carousel v-bind:movies="movies" @setMovie="test"/>

methods: {
    test(){
      this.testData = "movie changed";
    }
  }

未在Home组件上检测到Carousel @setMovie发射。

javascript vue.js
2个回答
0
投票

您可以在Vue中使用EventBus实现。您将从一个组件中的方法(或所需的任何位置)发出一个事件,并在其他组件的lyfecycle挂钩期间注册侦听器。


0
投票

$emit事件不应该是骆驼的情况。请改用烤肉串。

尝试:

@click="$emit('set-movie', movieKey)

然后在轮播中:

@set-movie="$emit('set-movie', movieKey)

和在父​​母中

@set-movie="test"
© www.soinside.com 2019 - 2024. All rights reserved.