Não entendi muito bem, precisaria verificar o código para verificar exatamente esta comunicação, mas provavelmente será necessário a utilização de um watch ou computed property nas props
ou em alguma dela, no componente de agendamento, onde dentro do watch, após a requisição da API, você deve fazer com que sempre atualize os valores, uma vez que o watch sempre irá observar qualquer alteração de valor do objeto que você colocar.
Outra maneira é com a utilização de EventBus global, criando um arquivo como mostro abaixo, pode ser na raiz do projeto:
import Vue from 'vue'
export const EventBus = new Vue()
Assim, você fará a importação do mesmo em ambos os componentes:
import { EventBus } from './Eventbus.js';
E o componente Home que possui o botão que realiza a requisição da API fará a emissão do evento, pode ser algo como:
//...requisição da API
EventBus.$emit('nomeDoEvento', response.body[0])
E o outro componente, no caso o de agendamento ou qualquer outro que estiver escutando o evento, receberá o objeto passado, para isto ele deverá possuir o seguinte, preferencialmente em seu mounted ()
ou created ()
:
EventBus.$on('nomeDoEvento', param () => {
this.objetoOuArrayDeclaradoNoData = param
})
Não se esqueça de "desligar" o EventBus no beforeDestroy ()
:
EventBus.$off('nomeDoEvento')
this.$forceUpdate()
, com isso ele força o vue a atualizar as variáveis na página.props
dentro de "agendamento"? se as props forem passadas adata
só são lidas uma vez, tens de ter uma cadeia/sequência de código reactiva.