Переглянути джерело

update ja docs (#879)

* tweak getters.md from #791

* tweak some sections from #794

* translation about SSR notice at modules section (ref: #809)

* translation getters section (ref: #831)

* tweak testing section from #844
kazuya kawaguchi 7 роки тому
батько
коміт
5c0050b886
6 змінених файлів з 25 додано та 22 видалено
  1. 6 4
      docs/ja/actions.md
  2. 4 2
      docs/ja/getters.md
  3. 4 4
      docs/ja/modules.md
  4. 4 4
      docs/ja/mutations.md
  5. 5 6
      docs/ja/plugins.md
  6. 2 2
      docs/ja/testing.md

+ 6 - 4
docs/ja/actions.md

@@ -106,10 +106,12 @@ export default {
   // ...
   methods: {
     ...mapActions([
-      'increment' // this.increment() を this.$store.dispatch('increment') にマッピングする
+      'increment', // `this.increment()` を `this.$store.dispatch('increment')` にマッピングする
+      // `mapActions` もペイロードをサポートする:
+      'incrementBy' // `this.incrementBy(amount)` を `this.$store.dispatch('incrementBy', amount)` にマッピングする
     ]),
     ...mapActions({
-      add: 'increment' // this.add() を this.$store.dispatch('increment') にマッピングする
+      add: 'increment' // `this.add()``this.$store.dispatch('increment')` にマッピングする
     })
   }
 }
@@ -158,14 +160,14 @@ actions: {
 最終的に JavaScript の機能として近く導入される [async / await](https://tc39.github.io/ecmascript-asyncawait/) を使用することで、次のようにアクションを組み合わせることができます:
 
 ``` js
-// getData() と getOtherData() が Promise を返すことを想定している
+// `getData()``getOtherData()` が Promise を返すことを想定している
 
 actions: {
   async actionA ({ commit }) {
     commit('gotData', await getData())
   },
   async actionB ({ dispatch, commit }) {
-    await dispatch('actionA') // actionA が完了するのを待機する
+    await dispatch('actionA') // `actionA` が完了するのを待機する
     commit('gotOtherData', await getOtherData())
   }
 }

+ 4 - 2
docs/ja/getters.md

@@ -12,7 +12,9 @@ computed: {
 
 もしこの関数を複数のコンポーネントで利用したくなったら、関数をコピーするか、あるいは関数を共用のヘルパーに切り出して複数の場所でインポートする必要があります。しかし、どちらも理想的とはいえません。
 
-Vuex を利用するとストア内に "ゲッター" を定義することができます(ストアのための算出プロパティだと考えてください)。ゲッターはステート(状態)を第1引数として受け取ります:
+Vuex を利用するとストア内に "ゲッター" を定義することができます。それらをストアの算出プロパティと考えることができます。算出プロパティと同様に、ゲッターの結果はその依存関係に基づいて計算され、依存関係の一部が変更されたときにのみ再評価されます。
+
+ゲッターは第1引数として、state を受け取ります:
 
 ``` js
 const store = new Vuex.Store({
@@ -100,7 +102,7 @@ export default {
 
 ``` js
 ...mapGetters({
-  // this.doneCount を store.getters.doneTodosCount にマッピングさせる
+  // `this.doneCount``store.getters.doneTodosCount` にマッピングさせる
   doneCount: 'doneTodosCount'
 })
 ```

+ 4 - 4
docs/ja/modules.md

@@ -25,8 +25,8 @@ const store = new Vuex.Store({
   }
 })
 
-store.state.a // -> moduleA のステート
-store.state.b // -> moduleB のステート
+store.state.a // -> `moduleA` のステート
+store.state.b // -> `moduleB` のステート
 ```
 
 ### モジュールのローカルステート
@@ -38,7 +38,7 @@ const moduleA = {
   state: { count: 0 },
   mutations: {
     increment (state) {
-      // state はモジュールのローカルステート
+      // `state` はモジュールのローカルステート
       state.count++
     }
   },
@@ -251,7 +251,7 @@ store.registerModule(['nested', 'myModule'], {
 - 同じモジュールを使用する複数のストアを作成する;
 - 同じストアに同じモジュールを複数回登録する
 
-モジュールの状態を宣言するために単純なオブジェクトを使用すると、その状態オブジェクトは参照によって共有され、変更時にクロスストア/モジュールの状態汚染を引き起こします。
+モジュールの状態を宣言するために単純なオブジェクトを使用すると、その状態オブジェクトは参照によって共有され、変更時にクロスストア/モジュールの状態汚染を引き起こします。(例: `runInNewContext` オプションが `false` または `'once'` のとき、[SSR ではステートフルなシングルトンは避けます](https://ssr.vuejs.org/ja/structure.html#ステートフルなシングルトンの回避)。)
 
 これは、実際には Vue コンポーネント内部の `data` と全く同じ問題です。従って解決策も同じです。モジュールの状態を宣言するために関数を使用してください (2.3.0 以降でサポートされます):
 

+ 4 - 4
docs/ja/mutations.md

@@ -16,7 +16,7 @@ const store = new Vuex.Store({
 })
 ```
 
-直接ミューテーションハンドラを呼び出すことはできません。この mutations オプションは、どちらかいうと "タイプが `increment` のミューテーションがトリガーされたときに、このハンドラが呼ばれる" といったイベント登録のようなものです。ミューテーションハンドラを起動するためにはミューテーションのタイプを指定して **store.commit** を呼び出す必要があります:
+直接ミューテーションハンドラを呼び出すことはできません。この mutations オプションは、どちらかいうと "タイプが `increment` のミューテーションがトリガーされたときに、このハンドラが呼ばれる" といったイベント登録のようなものです。ミューテーションハンドラを起動するためにはミューテーションのタイプを指定して `store.commit` を呼び出す必要があります:
 
 ``` js
 store.commit('increment')
@@ -165,13 +165,13 @@ export default {
   // ...
   methods: {
     ...mapMutations([
-      'increment', // this.increment() を this.$store.commit('increment') にマッピングする
+      'increment', // `this.increment()``this.$store.commit('increment')` にマッピングする
 
       // mapMutations はペイロードサポートする:
-      'incrementBy' // this.incrementBy(amount) を this.$store.commit('incrementBy', amount) にマッピングする
+      'incrementBy' // `this.incrementBy(amount)``this.$store.commit('incrementBy', amount)` にマッピングする
     ]),
     ...mapMutations({
-      add: 'increment' // this.add() を this.$store.commit('increment') にマッピングする
+      add: 'increment' // `this.add()``this.$store.commit('increment')` にマッピングする
     })
   }
 }

+ 5 - 6
docs/ja/plugins.md

@@ -7,7 +7,7 @@ const myPlugin = store => {
   // ストアが初期化されたときに呼ばれます
   store.subscribe((mutation, state) => {
     // それぞれのミューテーションの後に呼ばれます
-    // ミューテーションは { type, payload } の形式で提供されます
+    // ミューテーションは `{ type, payload }` の形式で提供されます
   })
 }
 ```
@@ -62,7 +62,7 @@ const myPluginWithSnapshot = store => {
   store.subscribe((mutation, state) => {
     let nextState = _.cloneDeep(state)
 
-    // 以前の状態と以後の状態を比較...
+    // `prevState` と `nextState` を比較...
 
     // 次のミューテーションのために状態を保存
     prevState = nextState
@@ -103,9 +103,8 @@ const store = new Vuex.Store({
 const logger = createLogger({
   collapsed: false, // ログ出力されたミューテーションを自動で展開します
   filter (mutation, stateBefore, stateAfter) {
-    // ミューテーションを記録する必要がある場合は、true を返します
-    // returns true if a mutation should be logged
-    // `mutation` は { type, payload } です
+    // ミューテーションを記録する必要がある場合は、`true` を返します
+    // `mutation` は `{ type, payload }` です
     return mutation.type !== "aBlacklistedMutation"
   },
   transformer (state) {
@@ -114,7 +113,7 @@ const logger = createLogger({
     return state.subTree
   },
   mutationTransformer (mutation) {
-    // ミューテーションは、{ type, payload } の形式でログ出力されます
+    // ミューテーションは、`{ type, payload }` の形式でログ出力されます
     // 任意の方法でそれをフォーマットできます
     return mutation.type
   }

+ 2 - 2
docs/ja/testing.md

@@ -71,7 +71,7 @@ export const getAllProducts = ({ commit }) => {
 // inline loader のために require 構文を使用する
 // ここでは inject-loader を使って、モック化された依存関係を注入できるようにするモジュールファクトリーを返す
 import { expect } from 'chai'
-const actionsInjector = require('inject!./actions')
+const actionsInjector = require('inject-loader!./actions')
 
 // モックによってモジュールを作成する
 const actions = actionsInjector({
@@ -212,7 +212,7 @@ mocha test-bundle.js
 #### ブラウザでの実行
 
 1. `mocha-loader` をインストールする
-2. 上記 webpack 設定から `entry` を `'mocha!babel!./test.js'` に変更する
+2. 上記 webpack 設定から `entry` を `'mocha-loader!babel-loader!./test.js'` に変更する
 3. 設定を使用して `webpack-dev-server` を開始する
 4. ブラウザで `localhost:8080/webpack-dev-server/test-bundle` を開く