Vue.js - Which component lifecycle should be used for fetching data?
I`m prefer call API in created hook. Quote from alligator.io:
In the created hook, you will be able to access reactive data and events are active. Templates and Virtual DOM have not yet been mounted or rendered.
So you easy can access to data to parse and save response from a server if you need.
Regards.
The created() lifecycle hooks fullfills all requirements for fetching and processing API data.
However the official Vue documentation uses the mounted() lifecycle hook in example code for integration API calls with axios:https://vuejs.org/v2/cookbook/using-axios-to-consume-apis.html
Both lifecycle hooks mounted() and created() are widely used for fetching API data and considered as good practice.
The answers make sense but if we use the mounted() hook to call the API's, Assuming that the DOM is rendered. If we update a state here in mounted() will it trigger another render ?
I am sure that in created() hook the DOM is not yet mounted. So, I might go with created().