In order to loop through each item in an array, we will use the v-for Vue's directive.
The v-for loop works on arrays/objects and is used to loop through each item in an array. This directive requires a special syntax in the form of item in array where array is the source data array and item is an alias for the array element being iterated on.
Note
If you are coming from the PHP world you may notice that v-for is similar to PHP's foreach function. But be careful if you are used to foreach($array as $value).
Vue's v-for is exactly the opposite, value in array.
The singular first, the plural next.
Directive v-for can also take an integer. Whenever a number is passed instead of an array/object, the template will be repeated as many times as the number given:
<html>
<head>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.mi\
n.css" rel="stylesheet">
<title>Hello Vue</title>
</head>
<body...