Skip to content

Doc EN: Consitency #1477

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
May 29, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/en/advanced/data-fetching.md
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,7 @@ export default {
fetchData () {
this.error = this.post = null
this.loading = true
// replace getPost with your data fetching util / API wrapper
// replace `getPost` with your data fetching util / API wrapper
getPost(this.$route.params.id, (err, post) => {
this.loading = false
if (err) {
Expand Down
6 changes: 3 additions & 3 deletions docs/en/advanced/lazy-loading.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,14 @@

When building apps with a bundler, the JavaScript bundle can become quite large, and thus affect the page load time. It would be more efficient if we can split each route's components into a separate chunk, and only load them when the route is visited.

Combining Vue's [async component feature](http://vuejs.org/guide/components.html#Async-Components) and Webpack's [code splitting feature](https://webpack.js.org/guides/code-splitting-require/), it's trivially easy to
Combining Vue's [async component feature](http://vuejs.org/guide/components.html#Async-Components) and webpack's [code splitting feature](https://webpack.js.org/guides/code-splitting-require/), it's trivially easy to
lazy-load route components.

All we need to do is define our route components as async components:

``` js
const Foo = resolve => {
// require.ensure is Webpack's special syntax for a code-split point.
// `require.ensure` is webpack's special syntax for a code-split point.
require.ensure(['./Foo.vue'], () => {
resolve(require('./Foo.vue'))
})
Expand Down Expand Up @@ -42,4 +42,4 @@ const Bar = r => require.ensure([], () => r(require('./Bar.vue')), 'group-foo')
const Baz = r => require.ensure([], () => r(require('./Baz.vue')), 'group-foo')
```

Webpack will group any async module with the same chunk name into the same async chunk - this also means we don't need to explicitly list dependencies for `require.ensure` anymore (thus passing an empty array).
webpack will group any async module with the same chunk name into the same async chunk - this also means we don't need to explicitly list dependencies for `require.ensure` anymore (thus passing an empty array).
2 changes: 1 addition & 1 deletion docs/en/advanced/transitions.md
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ It is also possible to determine the transition to use dynamically based on the

``` js
// then, in the parent component,
// watch the $route to determine the transition to use
// watch the `$route` to determine the transition to use
watch: {
'$route' (to, from) {
const toDepth = to.path.split('/').length
Expand Down
4 changes: 2 additions & 2 deletions docs/en/api/route-object.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ The route object can be found in multiple places:

``` js
router.beforeEach((to, from, next) => {
// to and from are both route objects
// `to` and `from` are both route objects
})
```

Expand All @@ -25,7 +25,7 @@ The route object can be found in multiple places:
``` js
const router = new VueRouter({
scrollBehavior (to, from, savedPosition) {
// to and from are both route objects
// `to` and `from` are both route objects
}
})
```
Expand Down
8 changes: 4 additions & 4 deletions docs/en/api/router-link.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,10 +26,10 @@
<!-- renders to -->
<a href="home">Home</a>

<!-- javascript expression using v-bind -->
<!-- javascript expression using `v-bind` -->
<router-link v-bind:to="'home'">Home</router-link>

<!-- Omitting v-bind is fine, just as binding any other prop -->
<!-- Omitting `v-bind` is fine, just as binding any other prop -->
<router-link :to="'home'">Home</router-link>

<!-- same as above -->
Expand All @@ -38,7 +38,7 @@
<!-- named route -->
<router-link :to="{ name: 'user', params: { userId: 123 }}">User</router-link>

<!-- with query, resulting in /register?plan=private -->
<!-- with query, resulting in `/register?plan=private` -->
<router-link :to="{ path: 'register', query: { plan: 'private' }}">Register</router-link>
```

Expand Down Expand Up @@ -103,7 +103,7 @@
One consequence of this is that `<router-link to="/">` will be active for every route! To force the link into "exact match mode", use the `exact` prop:

``` html
<!-- this link will only be active at / -->
<!-- this link will only be active at `/` -->
<router-link to="/" exact>
```

Expand Down