Learn about adding custom code for property changes.
- [Instructor] Let's take a look at another way…we can manage properties that depend on other properties,…and that's by using watchers.…We're going to go back to our sports store example for this one…and look at virtual-agent.html,…which is in the exercise files in the chapter two,…video three start folder, starting at line 114.…This Virtual Agent is going to act…like it can answer any question for us,…but unfortunately the only thing it really knows how to do…is to fetch and display a list of the products…that H+ Sports sells,…which will be stored in a data property…that we'll add called products,…initially just an empty array.…
Once we have some products in this array…we'll display them with an unordered list…with a v-for on the list item element…with product in products.…And we'll just display the product's name…with string interpolation.…And you'll see where that name will come from in a moment.…We already have a property called question…that's two-way bound to the text field here,…as well as the response property that's displayed here.…
In this course, Michael Sullivan introduces the Vue framework, explains which problems it aims to solve, and shows how to add Vue to a new or existing webpage. Michael examines a Vue instance and its lifecycle, and shows simple and advanced data binding techniques along with how to manage CSS related attributes dynamically and handle user input and events. After he covers the key concepts and basic conventions of Vue, Michael dives into its component system, which can help you create modular, reusable code, and shows how to use the vue-router plugin to set up a single-page application with client-side routing.
- Creating a Vue app
- Applying control logic
- Binding to the style attribute and class attribute
- Reviewing the features of a Vue instance
- Registering and using Vue components
- Installing vue-cli and webpack
- Understanding the Vue app skeleton