在Vue.js中,Route Params
是一個非常重要的概念。它允許我們在不同視圖之間傳遞參數,從而實現一些更有意義的交互。與此同時,我們可以使用Vue Router提供的$route.params
對象輕松地訪問傳遞的參數。
舉例來說,假設我們有一個應用程序,用于顯示用戶的所有文章。每篇文章都有一個獨特的ID
,我們想在單獨的視圖中顯示每篇文章。我們可以通過Vue Router的Route Params
功能輕松實現這一點。
export default { name: 'ArticleView', data() { return { article: {} } }, mounted() { this.fetchArticle(this.$route.params.id) }, methods: { fetchArticle(id) { // 使用id獲取文章并存儲在文章對象中 } } }
如上所示,我們在mounted
鉤子中使用$route.params.id
從URL中提取ID
,并將其作為參數傳遞給fetchArticle
方法以獲取文章。使用這種方法,我們可以輕松地在不同的視圖之間傳遞參數,并在我們的組件中使用它們。