Доступ к параметру / динамическому свойству URL в мета-роутере для динамического заголовка страницы? - PullRequest
0 голосов
/ 17 июня 2019

Итак, у меня есть, например, этот маршрут в моих маршрутах:

{ name: 'user', path: '/user/:id', component: User, props: { default: true, sidebar: false }, meta: { showFooter: false, title: `Viewing User ${route.params.id}` } }

По сути, я хочу получить доступ к параметру id URL-адреса, чтобы задать заголовок страницы, но я не хочу делать это через компонент.

Использование $ {route.params.id} возвращает неопределенное значение, есть ли объект, к которому я могу получить доступ, который даст мне тот же результат? Я относительно новичок в Vue и Vue-router, поэтому не уверен, возможно ли это или нет.

Может быть, я должен установить это в компоненте, и если это так, я рад узнать, почему это лучший способ сделать это :)

1 Ответ

0 голосов
/ 17 июня 2019

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

computed: {
  title() { return `Viewing User ${this.$route.params.id}` }
}

Если вы хотите абстрагировать свою реализацию (для нескольких компонентов и т. Д.), Установите метаданные в beforeRouteUpdate. Тогда вы можете получить доступ к this.$route.

beforeRouteUpdate (to, from, next) {
    // called when the route that renders this component has changed,
    // but this component is reused in the new route.
    // For example, for a route with dynamic params `/foo/:id`, when we
    // navigate between `/foo/1` and `/foo/2`, the same `Foo` component instance
    // will be reused, and this hook will be called when that happens.
    // *** has access to `this` component instance. ***
  },

-> имеет доступ к this экземпляру компонента

...