How can i save the state of opened tab while refreshing? I have two tabs If I opened 2nd tab and than i refresh, it took me back to 1st tab. My code is
<template>
<section>
<div>
<button
@click="changeTab(CandiComTab1)"
class="uppercase px-3 w-auto py-3 text-xs"
>
timeline
</button>
<button
@click="changeTab(CandiComTab2)"
class="uppercase px-3 w-auto mx-1 text-xs py-3"
>
community member list
</button>
</div>
<div>
<keep-alive>
<component :is="currentTabComponent"></component>
</keep-alive>
</div>
</section>
</template>
<script setup>
import { markRaw, ref } from "@vue/reactivity";
import { useStore } from "../../store";
import CandiComTab1 from "./CandiCommunityTabs/CandiComTab1.vue";
import CandiComTab2 from "./CandiCommunityTabs/CandiComTab2.vue";
const store = useStore();
let currentTabComponent = ref(null);
let changeTab = (newTab) => {
currentTabComponent.value = markRaw(newTab);
};
changeTab(CandiComTab1);
</script>
I want my browser to remember that which tab was opened before refreshing the page.Suppose I have 3 tabs on 1 page and I opened the 2nd or 3rd tab, than I refresh the page it kick me back to 1st tab. How to prevent this.Is their any solution ?