сохранение URL-адреса перед переходом на новую страницу с помощью nuxt-ссылки

Question

Я хочу сохранить свой URL-адрес, когда я нахожусь на главной странице в браузере, прежде чем перейти на другую страницу, используя. Это мое :

      <NuxtLink
  :to="`/search?param={number}`"
  @click.native="assignAddress"
>
  SEARCH
</NuxtLink>

И это метод, который запускается при нажатии на nuxt-link:

      assignAddress() {
  localStorage.setItem("address", `${this.$route.path}`);
},

Проблема в том, что он сохраняется в браузере. Я думаю, что метод assignAddress срабатывает после того, как nuxt изменит страницу!

Как я могу сначала сохранить URL-адрес в браузере, а затем изменить страницу, чтобы в моем браузере я сохранял /main вместо /search?

Answer 1

@seyet, как насчет того, чтобы попробовать установить его в beforeRouteLeave штурманская охрана.

      beforeRouteLeave(to, from, next) {
  // called when the route that renders this component is about to
  // be navigated away from.
  // has access to `this` component instance.
}

Ссылка на найденные документыздесь

Просто не забудьте позвонить next() как только вы закончите.

Answer 2

Как упоминалось выше, вы действительно можете использовать некоторые средства защиты маршрутизатора.
Я предпочитаю использовать beforeRouteEnter над beforeRouteLeaveпотому что я чувствую, что поток разрешения может быть менее подвержен ошибкам, если мой целевой компонент правильно смонтирован, следовательно, во время перехода компонента не будет ошибок.

Вот как это будет выглядеть по коду

/pages/search-page.vue

      <template>
  <div>This is the search page</div>
</template>

<script>
export default {
  name: 'SearchPage',
  beforeRouteEnter(to, from, next) {
    console.log('came from', from)
    localStorage.setItem('address', from.path)
    next()
  },
}
</script>