2017-09-28 1 views
0

J'ai un code js qui est responsable de la sélection. Le site fonctionne sans recharger les pages (utilisez nuxt). Le problème est que si je change de route, cette sélection ne fonctionne pas. Comment puis-je réparer cela?js le code cesse de fonctionner après avoir navigué sur les routes sans redémarrer la page

$(function() { 
     $('.select_list_radio').on('click', function(){ 
      var current = $(this).find('label span').text(); 
      $(this).parents('.select_list_wrapper').find('.select_list_current .select_list_current_item').text(current); 
      $(this).parents('.select_list_wrapper').removeClass('open'); 
      $(this).parents('.select_list_wrapper').find('.select_list').css('display', 'block'); 
     }); 
    }) 
+0

appelez-vous quand l'élément '.select_list_radio' n'est pas présent dans les DOM? – thanksd

+0

@thanksd Non, la première fois que la page se charge, la sélection fonctionne. Ensuite, quand je pars sur les routes, ça cesse de fonctionner. Si vous rechargez la page, elle recommencera à fonctionner – Jussia

Répondre

0

Vous ne devez jamais faire un changement à un élément Vuejs gère parce que Vue ne sera pas au courant du changement et va aller de l'avant et à droite le remplacer dans le prochain cycle de mise à jour.

Donc, vous pouvez essayer d'encapsuler votre .select_list_radio dans un nouveau composant, ou mieux, essayez de penser dans Vue et de mettre jQuery.

Vous pouvez lire comment utiliser en toute sécurité avec jQuery Vuejs dans ce lien: https://vuejsdevelopers.com/2017/05/20/vue-js-safely-jquery-plugin/