Skip to content

Instantly share code, notes, and snippets.

@icarroll

icarroll/events.html

Created May 1, 2019 18:20
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save icarroll/cbc054b2e0cec627ae81f5581079b5b0 to your computer and use it in GitHub Desktop.
Save icarroll/cbc054b2e0cec627ae81f5581079b5b0 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
events.html
<!DOCTYPE html>
<html>
<head>
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/vuetify/dist/vuetify.min.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
</head>
<body>
<div id="app">
<v-app>
<v-content>
<template>
<v-data-table :headers="headers" :items="eventdata" class="elevation-1">
<template v-slot:items="props">
<td v-for="header in headers">
{{props.item[header.value]}}
</td>
<!--
<td>{{props.item.name}}</td>
<td>{{props.item.description}}</td>
-->
</template>
</v-data-table>
</template>
</v-content>
</v-app>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vuetify/dist/vuetify.js"></script>
<script>
app = new Vue({
el: '#app',
data: {
headers: [
{text: "Name", value: "name"},
{text: "Description", value: "description"},
],
eventdata: [
{name: "lol", description: "whut"},
],
},
/*
mounted: async function() {
this["eventdata"] = await fetch("/api/events")
.then(function(resp) {
return resp.json();
});
},
*/
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment