I have 2 API resources:
{
"id": 771,
"title": "Call to Alyce Herman - Engine Assembler",
"assigned_with_person_id": 317,
}
{
"id": 317,
"forename": "Lauriane",
"name": "Jude Greenfelder",
"oral_coach": 0,
"coordinator": 0,
"phone": "+32 2737515",
"get_organisation": {
"id": 5,
"name": "Sauer-Becker",
"city": "North Anne",
"region": "Trinidad and Tobago",
"street": 0,
"number": 745,
"postbox": null,
"postcode": 26791
}
}
<template>
<!-- How to put here organization name where are working person (assigned_with_person_id) with ID 317 ? -->
{{ currentPerson.get_organisation.name }}
</template>
<script>
export default {
data() {
return {
currentAppointment: {},
currentPerson: '',
}
},
created () {
this.axios
.get(`/api/appointments/${this.$route.params.id}`)
.then((response) => {this.currentAppointment = response.data;});
},
mounted() {
this.getCurrentPerson();
},
methods: {
getCurrentPerson() {
let personId = /*how to find and put here assigned_with_person_id from JSON of currentAppointment*/;
axios.get(`/api/persons/${personId}`)
.then(response => (this.currentPerson = response.data))
.catch(error => console.log(error));
}
}
}
</script>
How to find get assigned_with_person_id from Appointments-JSON and find this person in Persons-JSON, then put organization name of this person into Vue-template?
Thanks!
The problem has been solved with this code:
currentPersonFn() {
this.axios
//get current Appointment by ID from params
.get(`/api/appointments/${this.$route.params.id}`)
.then((response) => {
this.currentPID = response.data.assigned_with_person_id; // return only assigned_with_person_id
// put ID of Person into nested axios.get
axios.get(`/api/persons/${this.currentPID}`)
.then(response => {
this.currentPerson = response.data
//console.log(response.data)
});
});
},