VUE路由器和分頁鏈接

Question

我對搜索結果簡單分頁：

<ul class="pagination" v-if="lastPage > 1"> 
    <li v-for="pageNumber in lastPage"> 
     <router-link :to="{params: {page: pageNumber}}">${pageNumber}</router-link> 
    </li> 
</ul> 

我試着將它與VUE路由器集成。這是我的路由器實例：

const router = new VueRouter({ 
    history: true, 
    routes: [ 
     { path: '/:producent/:type/page/:page' }, 
     { path: '/:producent/page/:page' } 
    ] 
}) 

所以我想有網址：/mercedes/sedan或只是/mercedes對結果的1個頁面和/mercedes/sedan/page/x或/mercedes/page/x他人。

在這一刻我的鏈接工作，並只生成正確，當我打開url /mercedes/sedan/page/1。

如果我打開/mercedes/sedan我所有的路由器鏈接也是/mercedes/sedan。

如何解決？

Answer 1

我找到了解決方案。我認爲這不是優雅，但工程...我檢查url包含0123st字符串，然後我只是添加params（如果是）或我將其添加到路由器路徑。

<router-link :to="{params: {page: pageNumber}}" v-if="$route.path.indexOf('/page/') >= 0">${pageNumber}</router-link> 
<router-link :to="{path: $route.path.replace(/\/$/, '') + '/page/' + pageNumber}" v-else>${pageNumber}</router-link>