Translate v2 docs in Japanese.

docs/en/getters.md

@@ -1,4 +1,3 @@
-
 # Getters
 
 Sometimes we may need to compute derived state based on store state, for example filtering through a list of items and counting them:

docs/ja/SUMMARY.md

@@ -0,0 +1,22 @@
+# Vuex
+
+> 注意: これは [email protected] のドキュメントです
+
+- [1.0のドキュメントをお探しですか？](https://github.com/vuejs/vuex/tree/1.0/docs)
+- [リリースノート](https://github.com/vuejs/vuex/releases)
+- [インストール](installation.md)
+- [Vuex とは何か?](intro.md)
+- [Vuex 入門](getting-started.md)
+- コアコンセプト 
+  - [ステート](state.md)
+  - [ゲッター](getters.md)
+  - [ミューテーション](mutations.md)
+  - [アクション](actions.md)
+  - [モジュール](modules.md)
+- [アプリケーションの構造](structure.md)
+- [プラグイン](plugins.md)
+- [厳格モード](strict.md)
+- [フォームの扱い](forms.md)
+- [テスト](testing.md)
+- [ホットリローディング](hot-reload.md)
+- [API リファレンス](api.md)

docs/ja/actions.md

@@ -0,0 +1,174 @@
+# アクション
+
+アクションはミューテーションと似ていますが、下記の点で異なります:
+
+- アクションは、状態を変更するのではなく、ミューテーションをコミットします。
+- アクションは任意の非同期処理を含むことができます。
+
+シンプルなアクションを登録してみましょう:
+
+``` js
+const store = new Vuex.Store({
+  state: {
+    count: 0
+  },
+  mutations: {
+    increment (state) {
+      state.count++
+    }
+  },
+  actions: {
+    increment (context) {
+      context.commit('increment')
+    }
+  }
+})
+```
+
+アクションハンドラはストアインスタンスのメソッドやプロパティのセットと同じものを呼び出せるコンテキストオブジェクトを受け取ります。したがって `context.commit` を呼び出すことでミューテーションをコミットできます。あるいは `context.state` や `context.getters` で、状態やゲッターにアクセスできます。なぜコンテキストオブジェクトがストアインスタンスそのものではないのかは、後ほど[モジュール](modules.md)で説明します。
+
+実際にはコードを少しシンプルにするために ES2015 の[引数分割束縛（argument destructuring）](https://github.com/lukehoban/es6features#destructuring)がよく使われます（特に `commit` を複数回呼び出す必要があるとき）:
+
+``` js
+actions: {
+  increment ({ commit }) {
+    commit('increment')
+  }
+}
+```
+
+### アクションのディスパッチ
+
+アクションは `store.dispatch` がトリガーとなって実行されます:
+
+``` js
+store.dispatch('increment')
+```
+
+これは一見ばかげて見えるかもしれません。つまり、カウントをインクリメントしたいときに、どうして直接 `store.commit('increment')` を呼び出してミューテーションをコミットしないのか、と。**ミューテーションは同期的でなければならない**というのを覚えていますか？アクションはそうではありません。アクションの中では**非同期**の操作を行うことができます。
+
+``` js
+actions: {
+  incrementAsync ({ commit }) {
+    setTimeout(() => {
+      commit('increment')
+    }, 1000)
+  }
+}
+```
+
+アクションはペイロード形式とオブジェクトスタイルのディスパッチをサポートします:
+
+``` js
+// ペイロードを使ってディスパッチする
+store.dispatch('incrementAsync', {
+  amount: 10
+})
+
+// オブジェクトを使ってディスパッチする
+store.dispatch({
+  type: 'incrementAsync',
+  amount: 10
+})
+```
+
+より実践的な例として、ショッピングカートをチェックアウトするアクションを挙げます。このアクションは**非同期な API の呼び出し**と、**複数のミューテーションのコミット**をします:
+
+``` js
+actions: {
+  checkout ({ commit, state }, payload) {
+    // 現在のカート内の商品を保存する
+    const savedCartItems = [...state.cart.added]
+    // チェックアウトのリクエストを送信し、楽観的にカート内をクリアする
+    commit(types.CHECKOUT_REQUEST)
+    // shop API は成功時のコールバックと失敗時のコールバックを受け取る
+    shop.buyProducts(
+      products,
+      // 成功時の処理
+      () => commit(types.CHECKOUT_SUCCESS),
+      // 失敗時の処理
+      () => commit(types.CHECKOUT_FAILURE, savedCartItems)
+    )
+  }
+}
+```
+
+一連の非同期の処理を実行しつつ、ミューテーションのコミットによってのみ副作用（状態の変更）を与えていることに注意してください。
+
+### コンポーネント内でのアクションのディスパッチ
+
+`this.$store.dispatch('xxx')` でコンポーネント内でアクションをディスパッチできます。あるいはコンポーネントのメソッドを `store.dispatch` にマッピングする `mapActions` ヘルパーを使うこともできます（ルートの `store` が必要です）:
+
+``` js
+import { mapActions } from 'vuex'
+
+export default {
+  // ...
+  methods: {
+    ...mapActions([
+      'increment' // this.increment() を this.$store.dispatch('increment') にマッピングする
+    ]),
+    ...mapActions({
+      add: 'increment' // this.add() を this.$store.dispatch('increment') にマッピングする
+    })
+  }
+}
+```
+
+### アクションを構成する
+
+アクションはしばしば非同期処理を行いますが、アクションが完了したことをどうやって知れば良いのでしょう？そしてもっと重要なことは、さらに複雑な非同期処理を取り扱うために、どうやって複数のアクションを構成させるかということです。
+
+まず知っておくべきことは `store.dispatch` がトリガーされたアクションハンドラによって返された Promise を処理できることと、Promise を返すことです。
+
+``` js
+actions: {
+  actionA ({ commit }) {
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        commit('someMutation')
+        resolve()
+      }, 1000)
+    })
+  }
+}
+```
+
+すると次のようにできます:
+
+``` js
+store.dispatch('actionA').then(() => {
+  // ...
+})
+```
+
+また別のアクションで下記のように書くと:
+
+``` js
+actions: {
+  // ...
+  actionB ({ dispatch, commit }) {
+    return dispatch('actionA').then(() => {
+      commit('someOtherMutation')
+    })
+  }
+}
+```
+
+最終的に JavaScript の機能として近く導入される [async / await](https://tc39.github.io/ecmascript-asyncawait/) を使用することで、次のようにアクションを組み合わせることができます:
+
+``` js
+// getData() と getOtherData() を受け取って Promises を返す
+
+actions: {
+  async actionA ({ commit }) {
+    commit('gotData', await getData())
+  },
+  async actionB ({ dispatch, commit }) {
+    await dispatch('actionA') // actionA が完了するのを待機する
+    commit('gotOtherData', await getOtherData())
+  }
+}
+```
+
+> `store.dispatch` で異なるモジュール内の複数のアクションハンドラをトリガーすることができます。そのようなケースでは、全てのトリガーされたハンドラが解決されたときに解決する Promise が戻り値として返ってくることになります。

docs/ja/forms.md

@@ -0,0 +1,56 @@
+# フォームのハンドリング
+
+厳格モードで Vuex を使用するとき、Vuex に属する状態の一部で `v-model` を使用するのは少しトリッキーです:
+
+``` html
+<input v-model="obj.message">
+```
+
+`obj` がストアからオブジェクトを返す算出プロパティ (computed property) と仮定すると、`v-model` は input でユーザーが入力するとき、直接 `obj.message` を変更します。厳格モードでは、この変更は明示的に Vuex のミューテーションハンドラ内部で処理されていないため、エラーを投げます。
+
+それに対処するための "Vuex way" は、`<input>` の値をバインディングし、`input` または `change` イベントでアクションを呼び出すことです:
+
+``` html
+<input :value="message" @input="updateMessage">
+```
+``` js
+// ...
+computed: {
+  ...mapState({
+    message: state => state.obj.message
+  })
+},
+methods: {
+  updateMessage: ({ dispatch }, e) => {
+    this.$store.commit('updateMessage', e.target.value)
+  }
+}
+```
+
+ミューテーションのハンドラは以下のようになります:
+
+``` js
+// ...
+mutations: {
+  updateMessage (state, message) {
+    state.obj.message = message
+  }
+}
+```
+
+### 双方向算出プロパティ
+
+確かに、上記の例は単純な `v-model` と ローカルステートよりもかなり冗長で、`v-model` のいくつかの有用な機能が使えません。代わりに、セッターで双方向算出プロパティを使うアプローチがあります。
+
+``` js
+computed: {
+  message: {
+    get () {
+      return this.$store.state.obj.message
+    },
+    set (value) {
+      this.$store.commit('updateMessage', value)
+    }
+  }
+}
+```

docs/ja/getters.md

@@ -0,0 +1,91 @@
+# ゲッター
+
+例えば項目のリストをフィルタリングしたりカウントするときのように、ストアの状態を算出したいときがあります。
+
+``` js
+computed: {
+  doneTodosCount () {
+    return this.$store.state.todos.filter(todo => todo.done).length
+  }
+}
+```
+
+もしこの関数を複数のコンポーネントで利用したくなったら、関数をコピーするか、あるいは関数を共用のヘルパーに切り出して複数の場所でインポートする必要があります。- しかし、どちらも理想的とはいえません。
+
+Vuex を利用するとストア内に "ゲッター" を定義することができます（ストアのための算出プロパティだと考えてください）。ゲッターはストアを第1引数として受け取ります:
+
+``` js
+const store = new Vuex.Store({
+  state: {
+    todos: [
+      { id: 1, text: '...', done: true },
+      { id: 2, text: '...', done: false }
+    ]
+  },
+  getters: {
+    doneTodos: state => {
+      return state.todos.filter(todo => todo.done)
+    }
+  }
+})
+```
+
+ゲッターは `store.getters` オブジェクトから取り出されます:
+
+``` js
+store.getters.doneTodos // -> [{ id: 1, text: '...', done: true }]
+```
+
+ゲッターは第2引数として他のゲッターを受け取ります:
+
+``` js
+getters: {
+  // ...
+  doneTodosCount: (state, getters) => {
+    return getters.doneTodos.length
+  }
+}
+```
+
+``` js
+store.getters.doneTodosCount // -> 1
+```
+
+どのコンポーネントの内部でも簡単にゲッターを利用することができます:
+
+``` js
+computed: {
+  doneTodosCount () {
+    return this.$store.getters.doneTodosCount
+  }
+}
+```
+
+### `mapGetters` ヘルパー
+
+`mapGetters` ヘルパーはストアのゲッターをローカルの算出プロパティにマッピングさせます:
+
+``` js
+import { mapGetters } from 'vuex'
+
+export default {
+  // ...
+  computed: {
+    // ゲッターを computed に組み込む
+    ...mapGetters([
+      'doneTodosCount',
+      'anotherGetter',
+      // ...
+    ])
+  }
+}
+```
+
+ゲッターを異なる名前でマッピングさせたいときはオブジェクトを使います:
+
+``` js
+mapGetters({
+  // this.doneCount を store.getters.doneTodosCount にマッピングさせる
+  doneCount: 'doneTodosCount'
+})
+```

docs/ja/getting-started.md

@@ -0,0 +1,44 @@
+# Vuex 入門
+
+Vuex アプリケーションの中心にあるものは**ストア**です。"ストア" は、基本的にアプリケーションの**状態（state）**を保持するコンテナです。単純なグローバルオブジェクトとの違いが 2つあります。
+
+1. Vuex ストアはリアクティブです。Vue コンポーネントがストアから状態を取り出すとき、もしストアの状態が変化したら、ストアはリアクティブかつ効率的に更新を行います。
+
+2. ストアの状態を直接変更することはできません。明示的に**ミューテーションをコミットする**ことによってのみ、ストアの状態を変更します。これによって、全ての状態の変更について追跡可能な記録を残すことが保証され、ツールでのアプリケーションの動作の理解を助けます。
+
+### シンプルなストア
+
+> **注意:** 私たちは、このドキュメントのコード例に ES2015 のシンタックスを利用しています。 もし触れたことがなければ、[ぜひ触れてください](https://babeljs.io/docs/learn-es2015/)！
+
+Vuex を[インストール](installation.md) してから、ストアをつくってみましょう。Vuex ストアの作成は、とても簡単です。ストアオブジェクトの初期状態と、いくつかのミューテーションを準備するだけです。
+
+``` js
+// module を利用しているときはあらかじめ Vue.use(Vuex) を呼び出していることを確認しておいてください
+
+const store = new Vuex.Store({
+  state: {
+    count: 0
+  },
+  mutations: {
+    increment (state) {
+      state.count++
+    }
+  }
+})
+```
+
+これで `store.state` でストアオブジェクトの状態を参照でき、また `store.commit` メソッドで状態の変更を行うことができます。
+
+``` js
+store.commit('increment')
+
+console.log(store.state.count) // -> 1
+```
+
+そして `store.state.count` を直接変更する代わりにミューテーションをコミットする理由は、状態の変更を明確に追跡したいからです。このシンプルな規約は、あなたのコードの意図をさらに明確にし、コードを読んだ時にアプリケーションの状態の変更について、論理的に考えることができるようにします。加えて、私たちに全ての変更のログを取ったり、状態のスナップショットを取ったり、タイムトラベルデバッグを行うようなツールを実装する余地を与えてくれます。
+
+ストアオブジェクトの状態はリアクティブなので、コンポーネント内のストアの状態は、演算されたプロパティ内の状態を返します。コンポーネントメソッドでミューテーションをコミットすることによって状態の変更を行います。
+
+こちらが [Vuex を使った最も基本的なカウンターアプリの例](https://jsfiddle.net/yyx990803/n9jmu5v7/)です。
+
+これから Vuex のコアコンセプトについて詳しく説明していきます。まずは[状態（state）](state.md)からはじめましょう。