Soy totalmente nuevo en Vue, así que sé amable :)
Tengo una función que obtiene los atributos del usuario y, según el atributo, puedo ejecutar una consulta de graphql en otra función. Ambas funciones están en los métodos y se llaman en el ciclo de vida creado. Lo que hice fue asignarlo a una variable y representarlo en el DOM. Pero no puedo pasarlo en la función que quiero. Intenté ejecutar cada función en diferentes ganchos de ciclo de vida, pero no funcionó.
export default defineComponent({ name: 'IndexPage', data: function() { return { token: '', redirectUrl: '', authUser: '' } }, methods:{ async setUser() { this.authUser = authUser }, async getAtt() { Auth.currentAuthenticatedUser() .then(data => (this.authUser = data.attributes['custom:learn_url'])) .catch(err => console.log(err)); }, async getUrl() { const id = this.authUser; // This is where i want the id to assign the authUser value const learnUrl = await API.graphql({ variables: { id }, query: getLearnUrl }); this.redirectUrl = learnUrl.data.getLearnUrl.learnUrl; } }, created() { this.getAtt(); this.getUrl(); } })Creo que el problema podría estar en su método created() . Está llamando a un método asíncrono getAtt() , por lo que debe esperar a que se complete antes de poder usar la variable authUser que obtuvo anteriormente en la función getUrl() , de lo contrario, siempre estará vacía.
Cambie created() a asíncrono y espere las funciones.
async created() { await this.getAtt(); await this.getUrl(); }Además de la sugerencia de Tamas, también deberá esperar el resultado de la función Auth.currentAuthenticatedUser() .
export default defineComponent({ name: 'IndexPage', data: function() { return { token: '', redirectUrl: '', authUser: '' } }, methods:{ async setUser() { this.authUser = authUser }, async getAtt() { await Auth.currentAuthenticatedUser() // 👀 .then(data => (this.authUser = data.attributes['custom:learn_url'])) .catch(err => console.log(err)); }, async getUrl() { const id = this.authUser; // This is where i want the id to assign the authUser value const learnUrl = await API.graphql({ variables: { id }, query: getLearnUrl }); this.redirectUrl = learnUrl.data.getLearnUrl.learnUrl; } }, async created() { await this.getAtt(); this.getUrl(); } })