Estoy intentando hacer un conjunto de una variable en mi beforeCreate() para un componente y luego en el created() obtengo esa variable. Esencialmente, necesito configurar la variable en mi tienda y luego obtener esa variable. Mi created llama a una acción que ejecuta una promesa de axios que envía los datos al estado, y tengo un captador en la tienda al que quiero llamar en mi created() para obtener esos datos.
Sé que estoy obteniendo los datos correctos de mi promesa, ya que puedo verlos en el registro de mi consola, pero parece que no puedo obtener esos datos de mi captador.
Parece que no quiere funcionar, y creo que tiene que ver con el hecho de que axios aún no ha devuelto la promesa. ¿Cómo puedo asegurarme de que mi created() espere hasta que se haya devuelto la promesa de axios en beforeCreate()?
Código de muestra
..... Componente....
data(){ return{currentUser: null} }, beforeCreate(){ this.$store.dispatch('users/setCurrent') }, created(){ this.currentUser = this.$store.getters['users/current'].displayname }......Tienda.....
export const state = () => ({ current: {} }); export const mutations ={ setCurrent: (state, c) => (state.current = c) } export const getter = { current: state => state.current } export const actions = { setCurrent({commit, dispatch, rootState}){ this.$axios.$get('/api/user/current', {headers: rootState.sessionUser.current}) .then(res => { console.log(res) commit("setCurrent" res) }) }Intenta esperar respuesta en tus acciones:
export const actions = { async setCurrent({commit, dispatch, rootState}){ await this.$axios.$get('/api/user/current', {headers: rootState.sessionUser.current}) .then(res => { console.log(res) commit("setCurrent" res) }) }y luego en gancho creado o montado:
async created() { await this.$store.dispatch('users/setCurrent') this.currentUser = this.$store.getters['users/current'].displayname }