vue tab栏缓存解决跳转页面后返回的状态保持

最新推荐文章于 2025-06-13 10:06:52 发布

weixin_34389926

最新推荐文章于 2025-06-13 10:06:52 发布

阅读量2.2k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/Alitar/p/10860386.html

本文探讨了在Vue中如何实现tab栏页面跳转后返回，仍能保持之前的状态，主要涉及路由缓存和状态管理的技术解决方案。

<!DOCTYPE html>
<html lang="zh-cn">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
    <script src="./vue.js"></script>
    <style>
      .div {
        background-color: #ccc;
        height: 100px;
        width: 100px;
        float: left;
        margin-left: 10px;
      }
      .active {
        color: #f91;
      }
    </style>
  </head>
  <body>
    <div id="app" style="overflow: hidden">
      <a
        v-bind:class="[showTab.num == 1