Rendersing Lists with v-for

by Megi93

HTML

<div id="app">
	<ul>
	<!-- getting current index of ingredients -->
		<li v-for="(ingredient, index) in ingredients">
			{{ ingredient }} {{ index }}
		</li>
	</ul>
</div>

JavaScript

new Vue ({
	el: '#app',
	data: {
		ingredients: ['meal', 'fruit', 'cookies'],
		person: [
			{name: 'Max', age: 27, color: 'red'},
			{name: 'Anna', age: 'unknown', color: 'blue'}
		]
	}
})