【历史回顾】左右切换按钮的功能

src/views/History.vue

@@ -61,8 +61,16 @@
           史蒂夫罗杰斯大量进口
           史蒂夫罗杰斯大量进口
         </div>
-        <button class="left" />
-        <button class="right" />
+        <button
+          v-show="activeTimeId !== 0"
+          class="left"
+          @click="onClickLeftArrow"
+        />
+        <button
+          v-show="activeTimeId !== timeList.length - 1"
+          class="right"
+          @click="onClickRightArrow"
+        />
       </div>
       <img
         class="splitter"
@@ -94,8 +102,20 @@ export default {
       '追梦未来',
     ])
     const activeTimeId = ref(0)
+    function onClickLeftArrow() {
+      if (activeTimeId.value > 0) {
+        activeTimeId.value--
+      }
+    }
+    function onClickRightArrow() {
+      if (activeTimeId.value < timeList.length - 1) {
+        activeTimeId.value++
+      }
+    }
 
     return {
+      onClickLeftArrow,
+      onClickRightArrow,
       timeList,
       activeTimeId,
     }