From b1343da12085e968a5c940410cd6046abe3610f3 Mon Sep 17 00:00:00 2001 From: suprabha Date: Mon, 26 Nov 2018 15:14:41 +0530 Subject: [PATCH] docs(name-mode): added name mode section in passing props to route component (#2493) --- docs/guide/essentials/passing-props.md | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/docs/guide/essentials/passing-props.md b/docs/guide/essentials/passing-props.md index ce0f84a2d..3050acf16 100644 --- a/docs/guide/essentials/passing-props.md +++ b/docs/guide/essentials/passing-props.md @@ -72,4 +72,22 @@ The URL `/search?q=vue` would pass `{query: 'vue'}` as props to the `SearchUser` Try to keep the `props` function stateless, as it's only evaluated on route changes. Use a wrapper component if you need state to define the props, that way vue can react to state changes. +## Name mode + +You can pass props to component using their component name. + +``` js +const router = new VueRouter({ + routes: [ + { + path: '/user-profile', + component: {location: Location, userInfo: UserInfo}, + props: { userInfo: route => ({ isNewUser: false }) } + } + ] +}) +``` + +The URL `/user-profile` would pass `{ isNewUser: false }` to `userInfo` Component. + For advanced usage, check out the [example](https://github.com/vuejs/vue-router/blob/dev/examples/route-props/app.js).