Mpoknimu/client/src/components/InfoSerie.vue

77 lines
1.6 KiB
Vue

<template>
<div class="anime">
<h3>Info Anime</h3>
<div><p><strong>Anime Name: </strong>{{ episodes.title }}</p></div>
<h1>Episode</h1>
<ul>
<li v-for="episode in episodes.episodes" :key="episode.episodes">
{{ episode.slug }}
</li>
</ul>
<h1>Genre</h1>
<ul>
<li v-for="episode in episodes.tags" :key="episode.tags">
{{ episode }}
</li>
</ul>
<ul v-if="errors && errors.length">
<li v-for="error of errors" :key="error.errors">
{{error.message}}
</li>
</ul>
<button @click="volver">return</button>
</div>
</template>
<script>
import axios from "axios";
export default {
name: "anime",
data() {
return {
episodes: [],
errors: []
};
},
methods:{
volver(){
this.$router.push({name: 'Series'});
}
},
/* usarlo junto a child-route
watch: {
async $route() {
let slug = this.$route.params.slug;
try {
const response = await axios
.get("http://localhost:9000/series/1/" + slug)
.then(response => {
console.log(response.data);
this.episodes = response.data;
});
} catch (e) {
this.errors.push(e);
}
}
}, */
async created() {
let slug = this.$route.params.slug;
try {
const response = await axios
.get("http://localhost:9000/series/1/" + slug)
.then(response => {
console.log(response.data);
this.episodes = response.data;
});
} catch (e) {
this.errors.push(e);
}
}
};
</script>
<style scoped>
</style>