Vue 路由器链接参数答案

【问题标题】：Vue router-link paramsVue 路由器链接参数
【发布时间】：2018-04-30 01:12:39
【问题描述】：

我的路由器链接有问题 :to。我的路由器链接不呈现我的模板。这是我的网络路由、routes.js 和 vue 模板。我想点击 img 产品到：'product/1234'，但它只重定向我'产品'。我的错误在哪里？网页：

     Route::get('/product/{id}', 'ProductController@show');

routes.js：

 {
        path: '/product/:id',
        name: 'ProductIndex',
        component: ProductIndex
    }

和 Vue 模板：

 <div class="product" v-for="product in products">
            <router-link class="product-image" :to="{ path: 'product', params: { id: product.id}}">
                <img src="/static/shop/products/shoe-example.png"/>
            </router-link>
 </div>

【问题讨论】：

你知道vue-router 和 Laravel 路由系统是两个不同的东西，对吧？
ProductController 里面有什么方法显示？

标签： laravel routing vue.js

【解决方案1】：

您正在链接到路径，请尝试将其更改为您的路线名称：

<router-link class="product-image" :to="{ name: 'ProductIndex', params: { id: product.id}}">
      <img src="/static/shop/products/shoe-example.png"/>
</router-link>

【讨论】：