Render List of items

• Index 0: {{beers[0]}}
• Index 1: {{beers[1]}}

loop over "item_i in list":

• {{beer}}

or loop over "item_i of list" (more consistent with JavaScript syntax):

• {{beer}}

Note that the loop starts at 1 (?? I dont' get it... See below...)

Traversing object properties

Looping through all property values in "currentUser"

• {{v}}

To get each property name and property value:

• Property name is: {{k}}, Propery value is: {{v}}

To get each index as well

• {{i}}: {{k}} - {{v}}

I.e use value, key, index

looping over a range - the alias starts at 1

properties - the alias starts at 0

Iterating through arrays

• page.number is: {{page.number}}

Or, to get index:

• page.number is: {{page.number}} and its index is: {{i}}

• Beer at index {{i}} is: {{beer}}

Iterating through nested arrays

Using v-for and v-if together (for has precedence)

Max alcohol by Volume {{maxAbv}}%

• Beers
• {{beer}}

Detecting array changes

List to apply changes on:

• {{beer}}

Sort Reverse order Push 'b4' to the beer array Remove/get last beer
Add items to the beginning of the array with "unshift" Add
Remove/get the first item from the beginning of the array with "shift" Remove/get first
By using "splicing", remove/get the items starting from index 1 Remove/get inside
Remove/get the 2 items from within the array by using "splicing" Remove/get inside
Insert a beer in the middle of the array by using "splicing" Insert Fast detta blir ju fel ordning?!
Update a given element Update item at index 2 by using "set" Note that Vue cannot update individual Array elements