Estou com um problema, Preciso passar um objeto entre dois componentes independentes mas não estou a conseguir, já tentei com o $broadcast mas sem sucesso, seguem os meus componentes para terem a ideias da estrutura. O objetivo era passar um objeto do componente e o componente
App.Vue:
<template>
<div id="app">
<main>
<slide></slide>
<div class="container">
<div class="row">
<div class="col s12 m9 l9">
<div class="spinner" v-if="loading">
<div class="indeterminate"></div>
</div>
<body-content v-if.sync="show"></body-content>
</div>
<div class="col s12 m3 l3 center-align">
<right v-if.sync="show"></right>
</div>
</div>
</div>
</main>
<footer class="page-footer">
<div class="container">
<div class="row">
<div class="col l2 s12">
<img class="responsive-img" :src="'storage/guest/' + logoFeup">
</div>
<div class="col l6 s12">
<div class="morada" style="margin-left:55px;">
<h6><strong>Faculdade de Engenharia da Universidade do Porto</strong></h6>
<p class="text-lighten-4 adress-footer">
Rua Dr. Roberto Frias, s/n <br/>
4200-465 Porto <br/>
PORTUGAL<br/>
Contacte-nos
</p>
</div>
</div>
<div class="col l4 s12 valign-wrapper social-media">
<span style="font-size: 13px;">SIGA-NOS:</span>
<span class="fa-stack fa-lg">
<i class="fa fa-circle-thin fa-stack-2x"></i>
<i class="fa fa-twitter fa-stack-1x"></i>
</span>
<span class="fa-stack fa-lg">
<i class="fa fa-circle-thin fa-stack-2x"></i>
<i class="fa fa-facebook fa-stack-1x"></i>
</span>
<span class="fa-stack fa-lg">
<i class="fa fa-circle-thin fa-stack-2x"></i>
<i class="fa fa-linkedin fa-stack-1x"></i>
</span>
<span class="fa-stack fa-lg">
<i class="fa fa-circle-thin fa-stack-2x"></i>
<i class="fa fa-instagram fa-stack-1x"></i>
</span>
</div>
</div>
</div>
</footer>
</div>
<script type="text/javascript">
import SlideComponent from './Slide.vue';
import GuestComponent from './Guest.vue';
import RightComponent from './Right.vue';
//import NoticiaIndexComponent from './noticia/NoticiaIndex.vue';
export default{
components:{
'body-content': GuestComponent,
'slide': SlideComponent,
'right': RightComponent,
//'noticia-index': NoticiaIndexComponent,
},
created(){
window.Vue.http.interceptors.unshift((request, next) => {
this.loading = true;
next(()=>{
this.loading = false;
this.show = true;
});
});
},
data(){
return {
loading: false,
logoFeup: 'feup-logo.png',
show: false,
}
},
}
<style type="text/css">
#app{
display: flex;
min-height: 100vh;
flex-direction: column;
}
main {
flex: 1 0 auto
}
</style>