diff --git a/docs/en/essentials/history-mode.md b/docs/en/essentials/history-mode.md index ae4b778bc..6e543a509 100644 --- a/docs/en/essentials/history-mode.md +++ b/docs/en/essentials/history-mode.md @@ -15,7 +15,7 @@ When using history mode, the URL will look "normal," e.g. `http://oursite.com/us Here comes a problem, though: Since our app is a single page client side app, without a proper server configuration, the users will get a 404 error if they access `http://oursite.com/user/id` directly in their browser. Now that's ugly. -Not to worry: To fix the issue, all you need to do is add a simple catch-all fallback route to your server. If the URL doesn't match any static assets, it should serve the same `index.html` page that your app lives in. Beautiful, again! +Not to worry: To fix the issue, all you need to do is add a simple catch-all fallback route to your server. If the URL doesn't match any static assets, it should serve the same `index.html` page that your app lives in. Beautiful, again! ## Example Server Configurations @@ -45,6 +45,7 @@ location / { For Node.js/Express, consider using [connect-history-api-fallback middleware](https://github.com/bripkens/connect-history-api-fallback). #### Internet Information Services (IIS) + ```xml @@ -61,10 +62,10 @@ For Node.js/Express, consider using [connect-history-api-fallback middleware](ht - - + + - + @@ -73,6 +74,7 @@ For Node.js/Express, consider using [connect-history-api-fallback middleware](ht ``` #### Caddy + ``` rewrite { regexp .* diff --git a/docs/en/essentials/nested-routes.md b/docs/en/essentials/nested-routes.md index 35241f0f4..e39ebdf9a 100644 --- a/docs/en/essentials/nested-routes.md +++ b/docs/en/essentials/nested-routes.md @@ -48,8 +48,7 @@ const User = { } ``` -To render components into this nested outlet, we need to use the `children` -option in `VueRouter` constructor config: +To render components into this nested outlet, we need to use the `children` option in `VueRouter` constructor config: ``` js const router = new VueRouter({ diff --git a/docs/en/essentials/passing-props.md b/docs/en/essentials/passing-props.md index c50483d9d..4243c0cfe 100644 --- a/docs/en/essentials/passing-props.md +++ b/docs/en/essentials/passing-props.md @@ -27,10 +27,10 @@ const User = { const router = new VueRouter({ routes: [ { path: '/user/:id', component: User, props: true } - + // for routes with named views, you have to define the props option for each named view: { - path: '/user/:id', + path: '/user/:id', components: { default: User, sidebar: Sidebar }, props: { default: true, sidebar: false } } @@ -59,8 +59,7 @@ const router = new VueRouter({ ### Function mode -You can create a function that returns props. -This allows you to cast the parameter to another type, combine static values with route-based values, etc. +You can create a function that returns props. This allows you to cast the parameter to another type, combine static values with route-based values, etc. ``` js const router = new VueRouter({ @@ -72,8 +71,6 @@ const router = new VueRouter({ The url: `/search?q=vue` would pass `{query: "vue"}` as props to the SearchUser component. -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. - +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. For advanced usage, checkout the [example](https://github.com/vuejs/vue-router/blob/dev/examples/route-props/app.js).