<template> <article class="message is-warning"> <div class="message-header"> <span>Code Quotes</span> </div> <div class="message-body"> <span v-html="fetchedQuotes.data.quote"></span> <span>{{fetchedQuotes.data.author}}</span> </div> </article> </template> <script> export default { data(){ return { fetchedQuotes: [], contentUrl: "https://apiurl.tld/" }; }, mounted() { this.getQuotes(this.contentUrl, "quotes"); }, methods: { async getQuotes(url, collection) { try { let response = await fetch(url + collection+"/"+Math.ceil(Math.random()*6)); this.fetchedQuotes = await response.json(); } catch (error) { console.log(error); } } } }; </script>

Estoy tratando de obtener cotizaciones aleatoriamente de una API de proyecto de Directus. Pero este código sigue dándome el error :

No capturado (en promesa) TypeError: no se pueden leer las propiedades de undefined (leyendo 'cita').

Probé varias soluciones diferentes, pero ahora estoy atascado y necesito ayuda para descubrir qué impide que este código funcione.

Cualquier ayuda será apreciada.