If you are even a little into programming, one of the first things you'll hear is iteration versus recursion. Vue has both, and if you have some tree structured graphics or menus in your application, Vue's got you covered. In this recipe, we will illustrate on this point by building a classification of animals in a recursive fashion.
We will use a couple of props in this recipe, so ensure that you have the Passing data to your component with props recipe completed before starting this one.
First of all, let's write an empty Vue instance that we will fill:
new Vue ({ el: '#app' })
You will need some material to work with; by this, I mean a whole lot of animals to classify. You can copy maybe only a part of this code in your Vue instance data, but to give you some inspiration, here it comes, the longest listing in this whole book:
data: { living: { animals: { invertebrates: { crab: null, bee: null, ...