如何獲取路由參數以與vue-router和vuex一起使用

Question

我正在嘗試將數據從組件傳遞到$ route.params.post，但是沿行失敗了，我不確定如何使它工作。

在我的組件中，我使用router-link轉到我的路由文件中的特定路徑，但未路由到指定的組件。

// Component.vue

<router-link :to="{ path: 'replies', params: { post: postId }}">
    <div class="button is-light is-small has-replies" @click=" postId = thread.no ">Replies</div> 
    //clicking replies will push the thread number to data and load it into the params
</router-link>

export default {
    data () {
        return {
            postId: null
        }
    }
}

// ./routes/index.js

import Replies from '../components/Replies'

routes: [
    { path: '/', component: Frontpage },
    { path: '/replies/:post', component: Replies }
]

單擊該按鈕應打開“答復”組件，其路由類似於/replies/#但它只是加載空白頁面而完全忽略了該組件。 我進口vuex-router-sync在我main.js ，但我不能告訴如果是這樣的問題，但我知道它很好可能是因為我不能完全肯定我使用vuex-router-sync正確vuex-router-sync 。

Answer 1

您可以嘗試如下操作，因為postId不是URL參數，而是URL本身的一部分：

<router-link :to="'replies/'+ postId'">
    <div class="button is-light is-small has-replies" @click=" postId = thread.no ">Replies</div> 
    //clicking replies will push the thread number to data and load it into the params
</router-link>