Блог

Я застрял с проблемой цикла, у которой, я думаю, не должно быть причин. В компоненте вложенной динамической страницы Nuxt (_id.vue) я хочу проверить, to.hash не пусто ли в beforeRouteLeave защите навигации, но когда я выполняю эту проверку, и это правда, я получаю RangeError: Maximum call stack size exceeded .

Я провел тест console.log('test') и увидел, что он вызывается без остановки, пока браузер не остановит его, чтобы предотвратить его сбой.

   beforeRouteLeave (to, from, next) {
    // there is hash and if the user click the back button of the browser, I want to return him to the position of the product file where he was before the click to enter into it
    if (to.name.startsWith('index___') amp;amp; to.hash !== '') {
      next({ path: to.path, hash: `#${this.$route.params.id}` })
    } else {
      next()
    }
  }
  

Это происходит только в том случае, если я проверяю to.hash !== '' , но не для to.hash === '#ct' , и я не могу понять, почему?

Если пользователь переходит с индексной страницы с хэшем в пути, если он нажимает кнопку «Назад» браузера, я хочу вернуть его в положение на странице, где он был, когда он нажал, чтобы перейти на _id страницу.

Может кто-нибудь помочь мне, пожалуйста, понять, что здесь происходит?

Спасибо

Я получил ответ, который помог мне на форуме Vue, я не знал, что next() это вызывало процесс и что мой beforeRouteLeave хук переоценивал новый to.hash , который я установил, вызывая цикл ( to.hash !== '' всегда был true).

Обязательно проверьте значение, противоположное тому, которое пройдет условие после того, как вы установите его в первый раз.

вот код для устранения проблемы:

   beforeRouteLeave (to, from, next) {
    if (to.name.startsWith('index___') amp;amp; (to.hash === '#ct' | (to.hash !== `#${this.$route.params.id}` amp;amp; to.hash !== ''))) {
      next({ path: to.path, hash: `#${this.$route.params.id}` })
    } else {
      next()
    }
  }
  

Я надеюсь, что это может помочь кому-то еще.