Chapter 4. Reactivity – Binding Data to Your Application

In the previous chapter, you learned one of the most important concepts of Vue.js: components. You saw how to create components, how to register, how to invoke, and how to use and reuse them. You also learned the concept of single-file components and even used them in the shopping list and Pomodoro applications.

In this chapter, we will go deeper into the concept of data binding. We have already talked about it earlier, so you are already familiar with it. We will bind data in all possible ways in our components.

Summing it up, in this chapter, we are going to:

• Revisit the data binding syntax
• Apply data binding in our applications
• Iterate over the array of elements and render each element using the same template with different data
• Revisit and apply the shorthands of data and events binding in our applications