Vue Router 页面间传递参数

Vue About 557 words

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方式传递参数则不受刷新影响,一直可以获取参数的值。

Views: 1,522 · Posted: 2020-11-30

————        END        ————

Give me a Star, Thanks:)

https://github.com/fendoudebb/LiteNote

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

扫描下方二维码关注公众号和小程序↓↓↓
Today On History
Browsing Refresh