Estoy escribiendo una aplicación vue y obtengo mis datos de una API
Quiero mostrar el nombre de la persona que hizo la pregunta.
Aquí están los datos
{ "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", } } ] }Aquí está mi código vuejs
<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>El código que obtiene la 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>Recibo el error de que comment.incubatee es nulo
¿Cómo soluciono este problema?