当有多个链接跳转到一个页面的时候&＃xff0c;我们需要区分是哪个链接跳过来的
来显示不同的内容
DOCTYPE html>
<html lang&＃61;"en">
<head><meta charset&＃61;"UTF-8"><meta name&＃61;"viewport" content&＃61;"width&＃61;device-width, initial-scale&＃61;1.0"><meta http-equiv&＃61;"X-UA-Compatible" content&＃61;"ie&＃61;edge"><title>Documenttitle>
head>
<body><div id&＃61;"div1"><div><router-link to&＃61;"/home">首页router-link><router-link to&＃61;"/user">用户管理router-link><router-link to&＃61;"/post">贴子管理router-link>div><div><router-view name&＃61;"sidebar">router-view><router-view name&＃61;"content">router-view>div>div><script src&＃61;"https://cdn.bootcss.com/vue/2.6.0/vue.js">script><script src&＃61;"https://cdn.bootcss.com/vue-router/2.6.0/vue-router.js">script><script>window.onload &＃61; function(){let routesArr &＃61; [{path: &＃39;/home&＃39;,component: {template:&＃96;<div><h1>这是首页</h1></div>&＃96;
}},{path: &＃39;/user&＃39;,components: {sidebar: {template: &＃96;<div><ul><li> 这是 sidebar 传过来的数据1 </li><li> 这是 sidebar 传过来的数据2 </li></ul></div>
&＃96;},content: {template: &＃96;<div>这是content的内容</div>
&＃96;}}},{path: &＃39;/post&＃39;,components: {sidebar: {template: &＃96;<div><ul><li> 这是 content 传过来的数据1 </li><li> 这是 content 传过来的数据2 </li></ul></div>
&＃96;},content: {template: &＃96;<div>这是content的内容</div>
&＃96;}}}];const vRouter &＃61; new VueRouter({routes: routesArr})new Vue({el: &＃39;#div1&＃39;,router: vRouter})}script>
body>
html>
京公网安备 11010802041100号