A Vue application

In this section of the chapter, we will build a shopping cart application using the techniques that we have learned up until now with Vue. In our previous chapter, we built a product list and product details application using React, with the ability to specify how many of a particular item we would like to purchase.

This Vue application is intended to receive this information, and take over the display of a shopping cart. Our Vue application will need the ability to adjust the amount of a particular item we would like to purchase, as well as calculate the total cost (including tax and shipping) that a purchase would incur.

Application overview

An overview of the components we will build is shown in the following diagram:

Figure 13.7: Logical view of Vue components for the shopping cart application

Here, we start with the App.vue component, which will instantiate a collection of items in our shopping cart, and store it as a local state property...