Vue Router 页面间传递参数

Vuevue-router大约 557 字

params

跳转到posts页面,携带postId参数。

this.$router.push({ 
    name: 'posts', 
    params: { 
        postId: 123 
    }
})

posts页面,接收postId参数。

<div>
    params from other: {{this.$route.params.postId}}
</div>

页面路径

http://localhost/posts

query

跳转到posts页面,携带postId参数。

this.$router.push({ 
    path: 'posts', 
    query: { 
        postId: 123 
    }
})

posts页面,接收postId参数。

<div>
    query from other: {{this.$route.query.postId}}
</div>

页面路径

http://localhost/posts?postId=123

区别

使用params方式传递参数,页面刷新后将获取不到参数的值。而使用query方式传递参数则不受刷新影响,一直可以获取参数的值。

阅读 101 · 发布于 2020-11-30

————        END        ————

扫描下方二维码关注公众号和小程序↓↓↓

昵称:
随便看看换一批