У меня есть два компонента:
компонент 1: recherche
<template>
<button @click='allRecords()'>Search</button>
<table>
<thead>
<th class="center">Date</th>
<th class="center">Statut</th>
</thead>
<tbody>
<tr v-for='contact in contacts' @click="seeContactDetails(contact.data.bid)">
<td>{{ contact.date }}</td>
<td>{{ contact.data.statut }}</td>
</tr>
</tbody>
</table>
</template>
<script lang="js">
import axios from 'axios';
export default {
name: 'recherche',
components: {
},
props: [],
mounted() {
},
data() {
return {
contacts: [],
details:[],
}
},
methods: {
allRecords: function() {
axios.get(`/api/recherche/`)
.then(response => {
this.contacts = response.data.list;
})
.catch(error => {
console.log(error);
});
},
seeContactDetails: (bid) => {
window.location = `/#/detail/${bid}`;
axios.get(`/api/detail/contacts?bid=${bid}`)
.then(response => {
this.details = response.data.list;
})
.catch(error => {
console.log(error);
});
}
},
}
</script>
Но я хочу отобразить результат seeContactDetails (bid) в компоненте детали
Компонент2: деталь
<template lang="html">
<div v-for='detail in details'>
<!-- ligne -->
<div class="row">
<!-- colonne -->
<div class="col-md-2">org: {{detail.data.org}}</div>
<div class="col-md-2">num:{{detail.data.num}} </div>
</div>
</template>
<script lang="js">
export default {
name: 'detail',
props: ['recherche'],
mounted() {},
data() {
return {
details: []
}
},
methods: {
},
computed: {
}
}
</script>
В заключение я хочу прочитать результаты запроса axios в другом компоненте, но я не знаю, как мы это делаем, несмотря на документы.Я пытаюсь поместить название компонента recherche в реквизит деталей, но он не работает