Vuex component doesn't render on the page

Question

I've got a vue component that make an axios call to get the data and I'm using a Vuex action to make the api call. The problem is that when I load the page the component sometimes render and other times it doesn't. And I don't know what trigger this behaviour. I'm new to Vuex, any suggestion? thanks in advance

this is the action

getTickets({commit}, apiroute){
        console.log('getTickets action')
            let config = authHeader();
            
            axios
            .get(apiroute,config)
            .then(t => t.data)
            .then(t => {
                commit('setTickets', t);
                console.log(t)   
            })
            .catch(error => {
                console.log(error.t);
            });
    }

Answer 1

It is hard to say just based on this information.

Can it be that sometimes Axios call returns before components mounts and that is why it renders the component, while other times component crashes because it is missing some data that it is waiting from this API call?

If that is the case, use the if statement to display some loader until the Axios return and then display the necessary component.