1.可以通過程式碼的方式結合router-view來實現跳轉

 1 <template>
 2   <div>
 3 <!--    <router-link to="/home" tag="button" replace="" active-class="active">首頁</router-link>-->
 4 <!--    <router-link to="/about" replace="">關於</router-link>-->
 5 <!--    <router-view></router-view>-->
 6
 
     <button @click="homeClick" >關於</button>
 7     <button @click="aboutClick" >首頁</button>
 8     <router-view></router-view>
 9   </div>
10 </template>
11 
12 <script>
13 
14 
15 export default {
16   name: 'App',
17   methods:{
18     homeClick(){
 
19       // 這個跳轉有歷史記錄
20       // this.$router.push('/home')
21       // replace跳轉沒有歷史記錄
22       this.$router.replace('/home')
23     },
24     aboutClick(){
25       // this.$router.push('/about')
26       this.$router.replace('/about')
27     }
28   }
29 }
30 </script>
31 
32 <style>
33 .router-link-active {
 
34   color:red;
35 }
36 .active{
37   color:green;
38 }
39 .active1{
40   color:yellow;
41 }
42 
43 </style>

但是下方有報錯

本文來自部落格園，作者：kaer_invoker，轉載請註明原文連結：https://www.cnblogs.com/invoker2021/p/14985543.html