What is the difference between `path` and `fullPath` in VueJS router?

13,189

path: A string that is equal to the path of the current route, always resolved as an absolute path. Example: /user/11/posts, /user/37/posts

fullPath: The complete URL, including query and hash.

Others...

params: An object that contains key / value pairs of segments. query: An object that contains key / value pairs of the url value string. For example, for / foo? user = 1, we have $ route.query.user == 1. hash: The hash of the current path (without #), if one exists. If no hash is present, value will be a string empty. matched: An Array containing route records for all nested path segments of the current route. The route records are the copies of the objects in the route configuration. name: The name of the current route, if one exists.

Share:
13,189

Related videos on Youtube

Ulysse BN
Author by

Ulysse BN

Currently working at Klaxit as a back-end engineer, and by the way: we're hiring! RGeo maintainer. More about my code on git.io/ulysse If you want to get it touch, contact me at ruby -e 'p "YnVvbm9tby51bHlzc2VAZ21haWwuY29t".unpack1("m*")'.

Updated on September 15, 2022

Comments

  • Ulysse BN
    Ulysse BN over 1 year

    In my router.js file, when I'm using the beforeEach method, I get path and fullPath in the properties of to and from parameters. I'm wondering which one I should use for redirection purpose. I've seen both been used and I don't when to use which, and what is the difference between both.

    An exemple:

    export default new Router({
        mode: 'history',
        base: process.env.BASE_URL,
        routes: [{
            path: 'login'
            beforeEnter: (to, from, next) => {
                console.log(to, from) // the routes
                if (User.loggedIn()) {
                    next(from.fullPath) // or maybe `from.path`
                } else {
                    next()
                }
            },
        }]
    })