Как я могу повторно инициализировать одни и те же компоненты на разных маршрутах

Сценарий:

У меня есть многоступенчатая форма, если пользователь нажимает следующую кнопку, единственное, что меняется в маршруте, - это идентификатор, например. form /step/:id, но всякий раз, когда у меня есть шаги/маршруты, содержащие те же компоненты, что и предыдущий, он вызывает только «созданный» метод компонентов первого, а не вызывает следующий.

Есть ли способ воссоздавать/инициализировать компоненты каждый раз, когда я меняю маршруты?


person Monkey D Naruto    schedule 27.12.2016    source источник


Ответы (2)


Вы можете ознакомиться с разделом «Реагирование на изменения параметров» в документах

При использовании маршрутов с параметрами следует отметить, что когда пользователь переходит из /user/foo в /user/bar, будет повторно использоваться один и тот же экземпляр компонента. Поскольку оба маршрута отображают один и тот же компонент, это более эффективно, чем уничтожение старого экземпляра и последующее создание нового. Однако это также означает, что хуки жизненного цикла компонента вызываться не будут.

Чтобы реагировать на изменения параметров в том же компоненте, вы можете просто наблюдать за объектом $route:

  watch: {
    '$route' (to, from) {
      //update the variables with new route params
    }
  },

Вы также можете посмотреть мой аналогичный ответ здесь.

person Saurabh    schedule 27.12.2016

У меня возникла еще одна проблема. Всякий раз, когда мои параметры маршрута менялись, реквизиты, которые я передал этому компоненту, не обновлялись.

При первой загрузке значение реквизита обновляется, но когда я перехожу к следующему шагу/маршруту, $route обновляется, а также выполняется метод внутри часов, но значение передаваемого реквизита совпадает с значение первого шага/маршрута. Затем, когда я снова перехожу к следующему шагу/маршруту, значение компонента третьего шага/маршрута предположительно является значением компонента второго шага/маршрута. Похоже, что значение реквизита на 1 шаг отстает от фактического маршрута.

Вот как я передал реквизит:

<el-repeater :element.sync="element"></el-repeater>

Редактировать: но все данные, которые можно увидеть в пользовательском интерфейсе, обновлены и исправлены, и эти данные основаны на переданном реквизите.

person Monkey D Naruto    schedule 27.12.2016