javascript - Comment Vue empêche-t-il n'importe quelle page à onglet de revenir au premier onglet après l'avoir actualisé?
阿神
阿神 2017-05-18 11:02:28
0
3
1425

Comme dans l'exemple ci-dessus, lorsque je clique sur la page du terrain d'entraînement sur la page initiale du coach et que je parcoure la page du terrain d'entraînement, elle s'actualise, mais je ne veux pas revenir à la colonne du coach. Comment puis-je y parvenir ?

De même, lorsque je sélectionne la condition de filtre District de Nanshan, je clique pour sélectionner un terrain d'entraînement dans la liste à afficher, mais à mon retour, je souhaite le conserver dans l'état sélectionné du district de Nanshan (au lieu de toutes les zones du début), comment y parvenir ?

De plus, j'ai déjà vérifié sur Internet et découvert que quelqu'un avait proposé cette méthode :
1 Utilisez vuex pour enregistrer le statut
2 Stockez la boutique vuex dans localStorage
3 Après avoir actualisé la page, lisez localStorage pour initialiser la boutique vuex.
Je voudrais demander comment accomplir ?

阿神
阿神

闭关修行中......

répondre à tous(3)
漂亮男人

Vous avez déjà mentionné les 3 points ci-dessus, faites-le.
Fournissez une idée :
Lorsque vous cliquez pour passer de l'onglet 1 à l'onglet 2, enregistrez une marque localement, par exemple :

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

A ce moment, vous actualisez le navigateur tab2, et js détermine si le drapeau existe localement. S'il existe, tab2 est activé sinon, il revient à tab1.

Notez que l'indicateur stocké localement est supprimé lorsque tab1 est initialisé.

phpcn_u1582

Comme mentionné au premier étage, ajoutez l'indicateur d'étiquette actuel aux données d'option de l'instance Vue

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

C'est probablement l'idée, j'espère que ça pourra servir de référence pour l'affiche

洪涛

Ecrire les paramètres sur l'itinéraire est aussi une méthode

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal