vue列表跳转到详情

index.js

{
path:"/blog/:id",
name:"SingleBlog",
component:SingleBlog
}

 

1.<router-link v-bind:to="'/blog/' + blog.id"> <h2 v-color="">{{blog.title}}</h2> </router-link>列表页面跳转

2  详情页面

<script>
export default{
name:"single-blog",
data(){
return{
id:this.$route.params.id,
blog:{}
}
},
created(){
// console.log(this.id)
this.$http.get('https://jsonplaceholder.typicode.com/posts/'+this.id)
.then(function(data){
console.log(data)
this.blog=data.body
})
.then(function(data){
this.blog = data.body
})
},
}
</script>