Vue. js Параметры Router-Link не определены

Question

В моем vue. js я использую params в моей навигации. vue, чтобы передать его на следующую страницу, чтобы он использовался для динамической c маршрутизации, например:

<router-link tag="p" 
  :to="{name: 'Main', params: {category: link.linkCategory}}"  
  :key="link.linkCategory">

Ниже приводится часть индекса маршрутизатора. js:

export default [
{
    path: '/origin/:category',
    name: 'origin',
    component: () => import('@/views/origin/origin.vue'),
    props: true,
    children: [
        {
            path: '',
            name: 'Main',
            props: true,
            component: () => import('@/views/origin/Main.vue')
        }

Итак, в основном я передаю значение 'category' в качестве параметра для динамической c маршрутизации. Тем не менее, я получаю это предупреждающее сообщение в моей консоли всякий раз, когда я пытаюсь получить доступ через маршрутизатор-ссылку:

[vue -router] отсутствует параметр для именованного маршрута «Основной»: Ожидаемая «категория» подлежит определению

Все значения linkCategory хранятся в отдельном файле ссылки js для моего удобства, и маршрутизация действительно получает значения при нажатии каждой ссылки. Маршрутизация всех страниц работает нормально, но предупреждения консоли очень раздражают ...

Я знаю, что этот параметр будет пустым перед доступом к ссылке на маршрутизатор, но мне нужен способ go вокруг предупреждений. Я даже попробовал метод v-if, но здесь не сработало.

Пожалуйста, исправьте мой код из-за неправильных действий, которые я сделал.

Answer 1

Что произойдет, если вы измените атрибут to на другой формат следующим образом?

<router-link tag="p" 
  :to="`/origin/${link.linkCategory}`"  
  :key="link.linkCategory"