Vue.js 如何使用vue路由器和vuex获取路由参数

我试图将数据从一个组件传递到$route.params.post，但在这条线路的某个地方它失败了，我不知道如何让它工作

在我的组件中，我使用

路由器链接

转到路由文件中的特定路径，但它没有路由到指定的组件

// 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 }
]

//Component.vue
答复
//单击“回复”将线程号推送到数据中，并将其加载到参数中
导出默认值{
数据（）{
返回{
posted:null
}
}
}
//./routes/index.js
从“../components/Replies”导入答复
路线：[
{路径：'/'，组件：Frontpage}，
{路径：'/repress/：post'，组件：repress}
]

---

单击该按钮将打开Replies组件，其路由看起来类似于

/Replies/#

，但它只是加载一个空白页面并完全忽略该组件。我正在我的

main.js

上导入

vuex路由器同步

，但我不知道这是否是问题所在，但我很清楚这可能是因为我不完全确定我是否正确使用了

vuex路由器同步。

。

您可以像下面这样尝试，因为

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>

答复
//单击“回复”将线程号推送到数据中，并将其加载到参数中

为什么不直接将thread.no设置为路由器链接？为什么要先将其设置为数据？在应用saurabh的解决方案并正确设置链接后，我直接链接到

线程。不

通过

路由器链接

。当它不起作用时，我想我只是在尝试不同的方法使它起作用，而没有意识到这是一个简单的解决方案。