vue跳转传参刷新后参数消失

一开始须要实现的功能是跳转到一个页面而后传入一个产品ID号，而后在目标页面用这个ID号显示具体的产品信息
我是用的方法是在template中使用router-link标签

<router-link to="/product">
    <a @click="routerTo(productId)" href="#">{{ item.name }}</a>      
</router-link>
//将 productId 传入 /product 页面

routerTo():

routerTo(index){
    this.$router.push({ name:'product',params:{productId:index}});
}
//在product页面中能够直接使用productId属性了

上面的router-link方法是彻底错误的，想要传参数这种方法确实能够传过去，可是只要页面刷新，参数就会消失！
因此要把router-link改成：

<router-link :to="{name:'product'}">
    <a @click="routerTo(productId)" href="#">{{ item.name }}</a>      
</router-link>