the this.$route.params.id obtained during vue route switching remains the same.
you need to click the category and then click the computer before the phone can be changed, as shown in figure
Click the category-- Mobile
idid1
--id
the code is as follows
<div class="view_box">
<div>
<ul>
<li>
<router-link to="/cate">
<div style="text-align: center;"></div>
</router-link>
</li>
</ul>
</div>
<router-view></router-view>
</div>
<template id="cate_view_left">
<div>
<ul style="width: 20%;float: left;">
<li v-for="(info,idx) in cate_list">
<router-link :to="{name:"cate1",params:{id:info.id}}">{{info.cate_name}}</router-link>
</li>
</ul>
<router-view></router-view>
</div>
</template>
<template id="cart_view_right">
<div>
<ul style="width: 80%;float: right;">
<li>
{{id}}<!-- id -->
</li>
</ul>
</div>
</template>
js
<script type="text/javascript">
var router = new VueRouter({
routes:[{
path:"/cate",
component:{
data(){
return {
cate_list:[{id:1,cate_name:""},
{id:2,cate_name:""}]
}
},
template:"-sharpcate_view_left"
},
children:[{
path:"right/:id",
name:"cate1",
component:{
data(){
return{
id:""
}
},
created(){
this.id=this.$route.params.id
},
template:"-sharpcart_view_right"
}}]
}]
})
new Vue({
el:".view_box",
router
})
</script>