Skip to content

Commit 45e82bd

Browse files
committed
Update Japanese docs (#1813)
* docs: http -> https * docs: tweak js string quoting NOTE: pick up from vuejs/vue-router@7d2e60e * docs: pick up from vuejs/vue-router@a5ecfa1 * docs: translate previous commit * docs: pick up from vuejs/vue-router@8f10178 * docs: translate previous commit * docs: pick up from vuejs/vue-router@91f4ad7 * docs: translate previous commit * docs: pick up from vuejs/vue-router@a06e0b2 * docs: translate previous commit * docs: pick up from vuejs/vue-router@3b16bf1 * docs: translate previous commit * docs: pick up from vuejs/vue-router@f0871d1 * docs: translate previous commit * docs: update SUMMARY translation NOTE: pick up from vuejs/vue-router@b707352 * docs: fixed translation mistaking ref: vuejs/vue-router#1813 (comment) * docs: fixed typo
1 parent ece0077 commit 45e82bd

10 files changed

+105
-18
lines changed

docs/ja/SUMMARY.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
# vue-router 2
2-
<!--email_off-->
3-
> 注意: vue-router@2.x は Vue 2.x のみで動作します。[0.7 のドキュメントをお探しですか?](https://github.com/vuejs/vue-router/tree/1.0/docs/ja)
4-
<!--/email_off-->
2+
3+
> 注意: TypeScript ユーザ向けは、vue-router@>= 3.0 と vue@>=2.5 が必須、逆もまた同様です。
4+
55
**[リリースノート](https://github.com/vuejs/vue-router/releases)**
66

77
- [インストール](installation.md)

docs/ja/advanced/lazy-loading.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ const Foo = () => Promise.resolve({ /* component definition */ })
1616
import('./Foo.vue') // returns a Promise
1717
```
1818

19-
> Note: Babel を使用している場合、Babel が構文を正しく解析するために [syntax-dynamic-import](http://babeljs.io/docs/plugins/syntax-dynamic-import/) プラグインを追加する必要があります。
19+
> Note: Babel を使用している場合、Babel が構文を正しく解析するために [syntax-dynamic-import](https://babeljs.io/docs/plugins/syntax-dynamic-import/) プラグインを追加する必要があります。
2020
2121
2 つを組み合わせることで、これは、webpack によって自動的にコード分割される非同期コンポーネントを定義する方法です:
2222

docs/ja/advanced/navigation-guards.md

+23-2
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ router.beforeEach((to, from, next) => {
3030

3131
- **`next(false)`**: 現在のナビゲーションを中止します。もしブラウザのURLが変化した場合は(ユーザーが手動で変更した場合でも、戻るボタンの場合でも)、 `from` ルートのURLにリセットされます。
3232

33-
- **`next('/')` または `next({ path: '/' })`**: 異なる場所へリダイレクトします。現在のナビゲーションは中止され、あたらしいナビゲーションが始まります。
33+
- **`next('/')` または `next({ path: '/' })`**: 異なる場所へリダイレクトします。現在のナビゲーションは中止され、あたらしいナビゲーションが始まります。任意のロケーションオブジェクトを `next` に渡すことができます。この `next` には、`replace: true``name: 'home'` のようなオプション、そして [`router-link``to` プロパティ](../api/router-link.md)または [`router.push`](../api/router-instance.md#methods)で使用される任意のオプションを指定することができます。
3434

3535
- **`next(error)`**: (2.4.0+) `next` に渡された引数が `Error` インスタンスである場合、ナビゲーションは中止され、エラーは `router.onError()` を介して登録されたコールバックに渡されます。
3636

@@ -115,7 +115,28 @@ beforeRouteEnter (to, from, next) {
115115
}
116116
```
117117

118-
`beforeRouteLeave` 内で直接 `this` にアクセスすることができます。この去る際のガードは通常はユーザーが不意に編集を保存していない状態でこのルートを去ることを防ぐために使われます。このナビゲーションは `next(false)` を呼ぶことでキャンセルされます。
118+
コールバックを `next` に渡すことをサポートするのは、`beforeRouteEnter`フックだけであるということに注意してください。`beforeRouteUpdate``beforeRouteLeave` の場合、 `this` は既に利用可能です。したがって、コールバックを渡す必要はないので、*サポートされません*:
119+
120+
```js
121+
beforeRouteUpdate (to, from, next) {
122+
// `this` を使用
123+
this.name = to.params.name
124+
next()
125+
}
126+
```
127+
128+
**leave ガード**は、通常、ユーザが保存されていない編集内容で誤って経路を離れるのを防ぐために使用されます。ナビゲーションは `next(false)` を呼び出すことで取り消すことができます。
129+
130+
```js
131+
beforeRouteLeave (to, from , next) {
132+
const answer = window.confirm('Do you really want to leave? you have unsaved changes!')
133+
if (answer) {
134+
next()
135+
} else {
136+
next(false)
137+
}
138+
}
139+
```
119140

120141
### 完全なナビゲーション解決フロー
121142
1. ナビゲーションがトリガされる

docs/ja/advanced/scroll-behavior.md

+20-2
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@
22

33
クライアントサイドのルーティングを使っている時に、新しいルートに対してスクロールをトップへ移動させたいかもしれません、もしくは実際のページリロードがしているように history 要素のスクロールポジションを保持したいこともあるかもしれません。 `vue-router` ではこれらをさらによく実現できます。ルートナビゲーションにおけるスクロールの挙動を完全にカスタマイズすることができます。
44

5-
**注意: この機能は HTML5 history モードでのみ動作します**
5+
**注意: この機能は ブラウザが `history.pushState` をサポートしている場合のみ動作します**
66

7-
ルートインスタンスを作る時に`scrollBehavior` 関数を提供できます。
7+
ルーターインスタンスを作る時に`scrollBehavior` 関数を提供できます。
88

99
``` js
1010
const router = new VueRouter({
@@ -61,3 +61,21 @@ scrollBehavior (to, from, savedPosition) {
6161
```
6262

6363
きめの細かいスクロールの挙動コントロールを実装するために [ルートメタフィールド](meta.md) も利用可能です。詳細な例は [こちら](https://github.com/vuejs/vue-router/blob/dev/examples/scroll-behavior/app.js) をご参照ください。
64+
65+
### 非同期なスクローリング
66+
67+
> 2.8.0 で新規
68+
69+
期待する位置記述子 (position descriptor) に解決されるプロミスを返すこともできます:
70+
71+
``` js
72+
scrollBehavior (to, from, savedPosition) {
73+
return new Promise((resolve, reject) => {
74+
setTimeout(() => {
75+
resolve({ x: 0, y: 0 })
76+
}, 500)
77+
})
78+
}
79+
```
80+
81+
スクロールの振る舞いをページの遷移とうまく合わせるために、ページレベルのトランジションコンポーネントからのイベントにフックすることは可能ですが、ユースケースにおいて可能性のある食い違いと複雑さのために、単純に特定のユーザランド実装を可能にするために、このプリミティブな機能を提供します。

docs/ja/api/options.md

+7-2
Original file line numberDiff line numberDiff line change
@@ -74,11 +74,16 @@
7474
シグネチャ:
7575

7676
```
77-
(
77+
type PositionDescriptor =
78+
{ x: number, y: number } |
79+
{ selector: string } |
80+
?{}
81+
82+
type scrollBehaviorHandler = (
7883
to: Route,
7984
from: Route,
8085
savedPosition?: { x: number, y: number }
81-
) => { x: number, y: number } | { selector: string } | ?{}
86+
) => PositionDescriptor | Promise<PositionDescriptor>
8287
```
8388

8489
より詳細については [スクロールの振る舞い](../advanced/scroll-behavior.md) を参照してください。

docs/ja/essentials/dynamic-matching.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ const User = {
2525
}
2626
```
2727

28-
[こちら](http://jsfiddle.net/yyx990803/4xfa2f19/) のデモの例も確認してみてください。
28+
[こちら](https://jsfiddle.net/yyx990803/4xfa2f19/) のデモの例も確認してみてください。
2929

3030
1 つのルートが複数の動的なセグメントを持つこともできます。そして、それらは `$route.params` の一致したフィールドとマップされます。例:
3131

docs/ja/essentials/getting-started.md

+24-1
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,30 @@ const app = new Vue({
6464
// これで開始です!
6565
```
6666

67-
[動作](http://jsfiddle.net/yyx990803/xgrjzsup/) の例も確認してみてください.
67+
ルーターを注入することによって、`this.$router` と同様、任意のコンポーネント内部で現在のルートを `this.$route` としてアクセスすることができます:
68+
69+
```js
70+
// Home.vue
71+
export default {
72+
computed: {
73+
username () {
74+
// `params` が表示される
75+
return this.$route.params.username
76+
}
77+
},
78+
methods: {
79+
goBack () {
80+
window.history.length > 1
81+
? this.$router.go(-1)
82+
: this.$router.push('/')
83+
}
84+
}
85+
}
86+
```
87+
88+
ドキュメントを通して、しばしば `router` インスタンスを使用することがよくあります。`this.$router``router` を使用するのと全く同じです。`this.$router` を使用する理由は、ルーティング操作する必要がある全てのコンポーネントにルーターをインポートしたくないからです。
89+
90+
[動作](https://jsfiddle.net/yyx990803/xgrjzsup/) の例も確認してみてください.
6891

6992
`<router-link>` は対象のルートがマッチした時に自動的に `.router-link-active` が付与されるのにお気づきでしょうか。
7093
より詳細については [API リファレンス](../api/router-link.md) をご参照ください。

docs/ja/essentials/history-mode.md

+23-5
Original file line numberDiff line numberDiff line change
@@ -43,24 +43,24 @@ location / {
4343
#### Native Node.js
4444

4545
```js
46-
const http = require("http")
47-
const fs = require("fs")
46+
const http = require('http')
47+
const fs = require('fs')
4848
const httpPort = 80
4949

5050
http.createServer((req, res) => {
51-
fs.readFile("index.htm", "utf-8", (err, content) => {
51+
fs.readFile('index.htm', 'utf-8', (err, content) => {
5252
if (err) {
5353
console.log('We cannot open "index.htm" file.')
5454
}
5555

5656
res.writeHead(200, {
57-
"Content-Type": "text/html; charset=utf-8"
57+
'Content-Type': 'text/html; charset=utf-8'
5858
})
5959

6060
res.end(content)
6161
})
6262
}).listen(httpPort, () => {
63-
console.log("Server listening on: http://localhost:%s", httpPort)
63+
console.log('Server listening on: http://localhost:%s', httpPort)
6464
})
6565
```
6666

@@ -102,6 +102,24 @@ rewrite {
102102
}
103103
```
104104

105+
#### Firebase のホスティング
106+
107+
以下を `firebase.json` に追加します:
108+
109+
```
110+
{
111+
"hosting": {
112+
"public": "dist",
113+
"rewrites": [
114+
{
115+
"source": "**",
116+
"destination": "/index.html"
117+
}
118+
]
119+
}
120+
}
121+
```
122+
105123
## 注意
106124

107125
この点に関して注意があります。全ての not-found パスが `index.html` を提供するため、もはや 404 エラーをサーバーがレポートしなくなります。回避策として、Vue アプリケーション内で 404 ページを表示するために catch-all ルートを実装すべきです。

docs/ja/essentials/nested-routes.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -95,4 +95,4 @@ const router = new VueRouter({
9595
})
9696
```
9797

98-
この例の動作デモは [こちら](http://jsfiddle.net/yyx990803/L7hscd8h/) です。
98+
この例の動作デモは [こちら](https://jsfiddle.net/yyx990803/L7hscd8h/) です。

docs/ja/essentials/redirect-and-alias.md

+2
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,8 @@ const router = new VueRouter({
3535
})
3636
```
3737

38+
[ナビゲーションガード](../advanced/navigation-guards.md)はリダイレクトするルートに提供されず、ターゲット上のみに適用されるということに注意してください。例では、`beforeEnter` または `beforeLeave` ガードを `/a` ルートに追加しても効果がありません。
39+
3840
その他の高度な使い方として、[](https://github.com/vuejs/vue-router/blob/dev/examples/redirect/app.js) をご参照ください。
3941

4042
### エイリアス

0 commit comments

Comments
 (0)