javascript - Wie verhindert Vue, dass eine Tab-Seite nach der Aktualisierung zum ersten Tab zurückkehrt?

Question

Wenn ich wie im obigen Beispiel auf der Seite „Trainingsgelände“ auf die Seite „Trainingsgelände“ klicke und sie durchsuche, wird sie aktualisiert, aber ich möchte nicht zur Spalte „Trainer“ zurückspringen. Wie kann ich das erreichen? Als ich die Filterbedingung Nanshan District auswählte, klickte ich auf die gleiche Weise, um ein anzuzeigendes Trainingsgelände aus der Liste auszuwählen, aber als ich zurückkam ...

漂亮男人 · Answer

你都已经说了上面3点了，去做不就好了。
提供一个思路：
当你从tab1点击切换到tab2的时候就在本地存一个标记，比如：

sessionStorage.setItem("flag", "1");

此时你在tab2浏览器刷新，js判断本地是否存在flag，如果存在那就tab2激活；否则就回到tab1。

注意，tab1初始化的时候删掉本地存的flag。

phpcn_u1582 · Answer

如一楼所说，在 Vue 实例选项 data 中添加当前标签指示器

new Vue({
  el: '#app',
  data: {
    currentTab: localStorage.getItem('currentTab') || 0,
    tabItems: [
     // 标签数据
    ]
  },
  methods: {
    // 切换标签事件
    switchTab: function(index) {
        // 相关逻辑 ...
        localStorage.setItem('currentTab', index);
    }
  }
})

大概就这样子的思路，希望能给楼主参考

PHP中文网 · Answer

把参数写在路由上也是一种方法