javascript - Bagaimanakah Vue menghalang mana-mana halaman tab daripada kembali ke tab pertama selepas menyegarkannya?

Question

Seperti contoh di atas, apabila saya mengklik halaman tempat latihan pada halaman jurulatih awal dan menyemak imbas halaman medan latihan, ia menyegarkan, tetapi saya tidak mahu melompat kembali ke lajur jurulatih. Bagaimana saya boleh mencapai ini?

Begitu juga, apabila saya memilih keadaan penapis Daerah Nanshan, saya mengklik untuk memilih tempat latihan daripada senarai untuk dilihat, tetapi apabila saya kembali, saya mahu mengekalkannya di negeri yang dipilih di Daerah Nanshan (bukannya semua kawasan di permulaan), bagaimana untuk mencapai ini?

Selain itu, saya menyemak dalam talian sebelum ini dan mendapati seseorang mencadangkan kaedah ini:
1 Gunakan vuex untuk merekodkan status
2 Simpan kedai vuex dalam localStorage
3 Muat semula halaman dan baca localStorage untuk memulakan kedai vuex suka bertanya bagaimana mencapainya?

Answer 1

Anda telah menyebut 3 perkara di atas, lakukan sahaja.
Memberi idea:
Apabila anda mengklik untuk beralih daripada tab1 ke tab2, simpan tanda secara setempat, seperti:

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

Pada masa ini, anda memuat semula penyemak imbas tab2, dan js menentukan sama ada bendera itu wujud secara setempat. Jika ia wujud, tab2 diaktifkan jika tidak, ia akan kembali ke tab1.

Perhatikan bahawa bendera yang disimpan secara setempat dipadamkan apabila tab1 dimulakan.

Answer 2

Seperti yang dinyatakan di tingkat satu, tambahkan penunjuk label semasa pada data pilihan contoh Vue

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

Ini mungkin ideanya, harap boleh jadi rujukan poster

Answer 3

Menulis parameter pada laluan juga merupakan kaedah