Обновление данных на компоненте Vue, совместно используемых двумя маршрутами

Question

Итак, я объявил 2 разных маршрута и настроил их на использование одного и того же компонента. Как мне go обновить данные (различные запросы API на основе маршрута) в этом компоненте.

Мне удалось заставить его работать, вызвав метод this.updateData за слово и вызвав этот метод на created ловушка жизненного цикла, а также вызов его при просмотре свойства $route.path, и он работает, но мне кажется, что это грязный способ заставить его работать, и я могу что-то упустить.

Редактировать: я использую просто Vue js для Simple Page Application, никаких других фреймворков, ничего особенного.

Answer 1

Для тех, кто сталкивается с той же проблемой, vue. js пытается использовать экземпляры компонентов настолько, насколько это возможно, в основном, если у вас нет уникального атрибута key для компонента, он будет указывать на тот же экземпляр компонента , Поэтому, чтобы каждый раз при использовании этого компонента иметь другой экземпляр, добавьте атрибут key, который должен быть уникальным. например,

<router-view v-bind:key="$router.path" />

В этом случае он будет использовать путь в качестве ключа, так что для каждого маршрута, который вы используете совместно используемый компонент, он создаст новый экземпляр, и вы сможете получить доступ к created() крючок жизненного цикла на каждом.