javascript - 标签页切换，下一步需要保留未点击的页面

Question

如果单击 tab1，然后单击下一步按钮，则页面将为 tabPage3，但 tab2 必须保持为 tabPage2。当您在 tab3 页面上单击返回按钮时，它将返回到 tab1Page。
然后点击tab2，再点击next按钮，页面会是tab3Page，点击tab3页面中的back按钮返回tab2Page。
我怎样才能实现它？

<div class="d-flex justify-content-between title">
 <div class="shop-title" @click="currentTab = 0" :class="{active: currentTab === 0}">tab1</div>
 <div class="shop-title" @click="currentTab = 1" :class="{active: currentTab === 1}">tab2</div>
</div>

<div class="tab1Page" v-show="currentTab === 0">
  tab1Page
</div>

<div class="tab2Page" v-show="currentTab === 1">
  tab2Page
</div>
<div class="tab3Page">
  tab3Page
<button>back</button>
</div>
<button>next</button>

<script>
export default {
    name: "",
    props: {},
    data: function () {
      return {
        actives: false,
        currentTab: 0,
      };
    },
    methods: {
      active(index) {
        this.actives = index;
      },
      next() {
        if(currentTab === 0){
          $(.tab1).hide()
          $(.tab3).show()
        }
        })
      }
    },
  };
</script>

<style>
.title {
  width: 300px;
  background: #000;
  color: #fff;
  padding: 10px 60px;
}
.shop-title.active {
  background: #ccc;
}
.tab3{
  display: none;
}
</style>

标签： javascriptandroid