Skip to content

Instantly share code, notes, and snippets.

@rafabarbosa

rafabarbosa/vue.html

Created March 11, 2020 17:14
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save rafabarbosa/0cf95fd006e4eb9bb0042722b77c7606 to your computer and use it in GitHub Desktop.
Save rafabarbosa/0cf95fd006e4eb9bb0042722b77c7606 to your computer and use it in GitHub Desktop.
Download ZIP
Consumindo Github e mostrando a hora em tempo real
Raw
vue.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="container">
<!-- <ul>
<li v-for="repo in repos">{{ repo.name }}</li>
</ul> -->
<h1>{{ horario }}</h1>
<lista-repos items="repos"></lista-repos>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.11/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.2/axios.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.8.22/dayjs.min.js"></script>
<script>
const app3 = new Vue({
el: '.container',
data: {
repos: [],
horario: dayjs().format('YYYY-MM-DD HH:mm:ss')
},
created () {
this.carregar();
setInterval(() => {
this.horario = dayjs().format('YYYY-MM-DD HH:mm:ss');
}, 3000);
},
methods: {
carregar: function () {
axios.get('https://api.github.com/users/rafabarbosa/repos').then(response => {
this.repos = response.data;
}).catch(error => {
console.log('error: ' + error);
})
}
}
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment