Vue 2.0 Hello World
HTML
<script src="https://unpkg.com/vue"></script>
<div id="app">
<car-table></car-table>
</div>
JavaScript
Vue.component('car-table', {
data: function () {
return {
title: 'test title',
cars: [{
make: 'Honda',
model: 'Civic',
year: 2010
}, {
make: 'Toyota',
model: 'Camry',
year: 2012
}, {
make: 'Nissan',
model: 'Versa',
year: 2014
}]
};
},
template: '\
<table>\
<thead>\
<tr>\
<td colspan="5">{{title}}</td>\
</tr>\
</thead>\
<tbody>\
<tr>\
<template v-for="car in cars">\
<td>{{car.make}}</td><td>{{car.model}}</td><td>{{car.year}}</td>\
</template>\
</tr>\
</tbody>\
</table>',
});
new Vue({
el: '#app',
});