geometria
@geometria

Как создать динамические пути Vue?

Сейчас у меня на сайте находится порядка 100 роутов примерно такого вида:
/*app.js*/
{ 
      path: '/Телефон-Самсунг',
      name: 'phone_samsung',
      component: 'phone_samsung',
    },
{ 
      path: '/Телефон-Ксяоми',
      name: 'phone_xiaomi',
      component: 'phone_xiaomi',
    },
/************************************************/


Эти компоненты импортируют в себя шаблон (shablon.vue), и подставляя параметр product.id, отрисовывают страницу продукта.

Переход по роутам в app.js осуществляется со стартовой примерно так:
<div class="col-md-4">
       <router-link :to = "{name: product.ru_caption}" >
       <img :src="product.picture" :alt="product.name">
       </router-link>
     </div>


Вопрос-задача: как мне прописать в app.js динамический роут такого вида, передав сегмент "product.ru_caption":
{ path: '/:product.ru_caption', component: shablon},
  • Вопрос задан
  • 88 просмотров
Решения вопроса 1
Kozack
@Kozack
Параметры для динамических путей можно указывать так:
<router-link :to = "{name: '', params: {}}" >

Например:
// router.js
{
  name: 'product'
  path: '/:model'
}

// component.vue
<router-link :to = "{
  name: 'product', 
  params: {
    model: 'Телефон-Самсунг'
  }
}" >
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Enapter Санкт-Петербург
от 160 000 до 240 000 ₽
Junto Москва
от 120 000 до 180 000 ₽
17 февр. 2020, в 00:30
1500 руб./за проект
16 февр. 2020, в 22:28
2000 руб./за проект
16 февр. 2020, в 22:03
1200 руб./в час