大盘路由切换

src/views/bigScreen/components/bigScreenBtn/index.vue

@@ -1,23 +1,26 @@
 
 
 <template>
-  <div class="bigScreenBtn" :class="{selected:selected}">
-    <div>{{title}}</div>
-  </div>
+  <router-link :to="routerUrl">
+    <div class="bigScreenBtn" :class="{selected:this.$route.path == routerUrl}">
+      <div>{{title}}</div>
+    </div>
+  </router-link>
+
 </template>
 
 <script>
 export default {
   name: 'BigScreenBtn',
   props: {
+    routerUrl: {
+      type: String,
+      default: '',
+    },
     title: {
       type: String,
       default: '按钮',
     },
-    selected: {
-      type: Boolean,
-      default: false,
-    },
   },
   data () {
     return {
@@ -44,7 +47,7 @@ export default {
   background-image: url(./default.png);
 }
 .bigScreenBtn:hover {
-    opacity: .8;
+  opacity: 0.8;
 }
 
 .bigScreenBtn.selected {