Нужно организовать роут на vue2, при клике на определенный элемент, должно выходить : url/name.
Но страницу приходится каждый раз обновлять, без этого не показываются другие элементы.
Router
{ path: "/pokemon/:name", name:'name', component: pokemonDetail,props:true}
EachItem:
<template>
<div>
<div>
<p>
name: {{item.name}} </p>
order:{{item.order}}
weight:{{item.weight}}
</div>
<router-link :to='{name:"pokemon"}'>
back
</router-link>
</div>
</template>
<script>
import axios from 'axios'
export default {
methods:{
},
data(){
return{
name:this.$route.params.name,
item:[]
}
},
created(){
axios.get(`https://pokeapi.co/api/v2/pokemon/${this.name}`)
.then((res)=>{
this.item=res.data
})
},
}
</script>
<style>
</style>
Когда перехожу назад к списку покемонов и нажимаю на другой персонаж, то он не обновляется, в роутах имя менятся, но сами данные остаются прежними
Link:
<router-link :to="{name:'name',params:{name:pokemon.name}}">Info</router-link>
когда выбираю в первый раз , все работает:
Но во второй раз, данные остаются прежними