如何獲取路由參數與vue-router和vuex一起工作

我試圖從一個組件傳遞數據到$ route.params.post，但是它沿線的某處失敗了，我不知道如何得到它上班。如何獲取路由參數與vue-router和vuex一起工作

在我的組件中，我使用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/#但它只是加載一個空白頁，並完全忽略該組件打開回帖組件。我在main.js上導入了vuex-router-sync，但我無法確定是否是這個問題，但我很清楚它可能是因爲我不完全確定我正確使用vuex-router-sync。

來源

2016-11-19 Mr.Richway

你爲什麼不將thread.no設置爲直接在路由器鏈接？爲什麼這個奇怪的繞道首先將其設置爲數據？ –

在應用saurabh的解決方案並正確設置鏈接後，我通過'router-link'直接鏈接到'thread.no'。當它不工作，我想我只是嘗試不同的方式，使其工作沒有意識到這是一個簡單的解決方案。 –

，您可以嘗試像下面，作爲postId不是一個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>

來源

2016-11-20 02:41:49 Saurabh

如何獲取路由參數與vue-router和vuex一起工作

回答

相關問題