From the course: Vue.js 2 for Web Designers

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

First API call in a life cycle method

First API call in a life cycle method - Vue.js Tutorial

From the course: Vue.js 2 for Web Designers

Start my 1-month free trial

First API call in a life cycle method

- [Instructor] In this video, we're going to make our 1st API call to populate the message list with real data, and introduce lifecycle hooks. When this component loads, we want to retrieve status messages from the API, instead of showing the static data over here in the message list. We need to be a little careful about when that happens. That the component is actually ready to display the data, before we try to do that. Just like jQuery's ready function, or the DOMContentLoaded event in Vanilla JavaScript, you want to make sure that your target is ready before you try to use it. In View, there are special methods called lifecycle hooks, that let you do things at various times during the lifespan of a component. In our case, we're going to use one called Created, which, as you might guess, is a relatively early one, but a good place to load data. Switching back to my editor, here in hotel.js, I'm going to scroll down to the main view component. And I'm going to empty out all of these…

Contents