Вы должны следовать «общему шаблону предков».
Рассмотрим следующий Parent
компонент:
<template>
<div>
<child-one :onData="onDataFromChildOne"></child-one>
<child-two :newData="dataToChildTwo"></child-two>
</div>
</template>
<script>
export default {
name: "Parent",
data() {
return {
dataToChildTwo: null
}
},
methods: {
onDataFromChildOne(data) {
this.dataToChildTwo = data;
}
}
}
</script>
Компонент ChildOne
получит функцию с именем prop
с именем onData
, которая должна быть вызвана после завершения вызова ajax. Тогда:
<script>
import axios from 'axios';
export default {
name: "ChildOne",
props: ['onData'],
beforeMount() {
axios
.get('/data')
.then(res => {
this.onData(res.data);
});
}
}
</script>
Когда onData
будет выполнено, dataToChildTwo
будет обновлено и ChildTwo
получит новые данные.