I am writing a vue app and I am getting my data from an api
I want to show the name of the person that asked the question
Here is the data
{
"success":true,
"questions":[
{
"id":"1994db8a-66fb-43d8-aec8-290957dd9bcc",
"incubatee":{
"id":"ec58948b-64a7-4fa8-a438-baf6b016cdc3",
"user_id":"ee40dd45-1bc4-449a-ad69-e46a3e11e6fe",
"name":"Okafor Nnamdi",
}
}
]
}
Here is my vuejs code
<template>
<div v-for="(question, index) in allQuestions" :key="index" class="d-flex question-section">
<img src="@/assets/images/auth_background.png" alt="">
<div class="question" >
<div class="__heading">{{question.incubatee.name}} <span class="__time"> ago</span></div>
<div class="__body">
{{question.question}}
<div class="__view-reply">
<span>View Reply</span>
<span><i class="fas fa-arrow-circle-down"></i></span>
</div>
</div>
</div>
</div>
</template>
The code that fetches the api
<script>
import {onMounted} from "vue";
import axios from 'axios';
export default defineComponent({
setup() {
onMounted(() => {
axios.get(route.params.id).then(res => {
const {data} = res.data.questions;
// console.log('heyyyyyyyy',res.data.questions);
allQuestions.value = res.data.questions;
console.log("All Questions ", allQuestions.value);
}, err => {
console.log(err.response);
const {message} = err.response.data;
NotificationService.error(message || err.response.statusText);
});
}
return {
askQuestion
}
}
});
</script>
I am getting error that comment.incubatee is null
How do I solve this problem?