1
0
Alan Wang 3 жил өмнө
parent
commit
80b77429ff

+ 7 - 7
docs/guide/testing.md

@@ -4,7 +4,7 @@
 
 
 The main parts we want to unit test in Vuex are mutations and actions.
 The main parts we want to unit test in Vuex are mutations and actions.
 
 
-### Testing Mutations
+## Testing Mutations
 
 
 Mutations are very straightforward to test, because they are just functions that completely rely on their arguments. One trick is that if you are using ES2015 modules and put your mutations inside your `store.js` file, in addition to the default export, you should also export the mutations as a named export:
 Mutations are very straightforward to test, because they are just functions that completely rely on their arguments. One trick is that if you are using ES2015 modules and put your mutations inside your `store.js` file, in addition to the default export, you should also export the mutations as a named export:
 
 
@@ -49,7 +49,7 @@ describe('mutations', () => {
 })
 })
 ```
 ```
 
 
-### Testing Actions
+## Testing Actions
 
 
 Actions can be a bit more tricky because they may call out to external APIs. When testing actions, we usually need to do some level of mocking - for example, we can abstract the API calls into a service and mock that service inside our tests. In order to easily mock dependencies, we can use webpack and [inject-loader](https://github.com/plasticine/inject-loader) to bundle our test files.
 Actions can be a bit more tricky because they may call out to external APIs. When testing actions, we usually need to do some level of mocking - for example, we can abstract the API calls into a service and mock that service inside our tests. In order to easily mock dependencies, we can use webpack and [inject-loader](https://github.com/plasticine/inject-loader) to bundle our test files.
 
 
@@ -146,7 +146,7 @@ describe('actions', () => {
 })
 })
 ```
 ```
 
 
-### Testing Getters
+## Testing Getters
 
 
 If your getters have complicated computation, it is worth testing them. Getters are also very straightforward to test for the same reason as mutations.
 If your getters have complicated computation, it is worth testing them. Getters are also very straightforward to test for the same reason as mutations.
 
 
@@ -193,11 +193,11 @@ describe('getters', () => {
 })
 })
 ```
 ```
 
 
-### Running Tests
+## Running Tests
 
 
 If your mutations and actions are written properly, the tests should have no direct dependency on Browser APIs after proper mocking. Thus you can simply bundle the tests with webpack and run it directly in Node. Alternatively, you can use `mocha-loader` or Karma + `karma-webpack` to run the tests in real browsers.
 If your mutations and actions are written properly, the tests should have no direct dependency on Browser APIs after proper mocking. Thus you can simply bundle the tests with webpack and run it directly in Node. Alternatively, you can use `mocha-loader` or Karma + `karma-webpack` to run the tests in real browsers.
 
 
-#### Running in Node
+### Running in Node
 
 
 Create the following webpack config (together with proper [`.babelrc`](https://babeljs.io/docs/usage/babelrc/)):
 Create the following webpack config (together with proper [`.babelrc`](https://babeljs.io/docs/usage/babelrc/)):
 
 
@@ -228,13 +228,13 @@ webpack
 mocha test-bundle.js
 mocha test-bundle.js
 ```
 ```
 
 
-#### Running in Browser
+### Running in Browser
 
 
 1. Install `mocha-loader`.
 1. Install `mocha-loader`.
 2. Change the `entry` from the webpack config above to `'mocha-loader!babel-loader!./test.js'`.
 2. Change the `entry` from the webpack config above to `'mocha-loader!babel-loader!./test.js'`.
 3. Start `webpack-dev-server` using the config.
 3. Start `webpack-dev-server` using the config.
 4. Go to `localhost:8080/webpack-dev-server/test-bundle`.
 4. Go to `localhost:8080/webpack-dev-server/test-bundle`.
 
 
-#### Running in Browser with Karma + karma-webpack
+### Running in Browser with Karma + karma-webpack
 
 
 Consult the setup in [vue-loader documentation](https://vue-loader.vuejs.org/en/workflow/testing.html).
 Consult the setup in [vue-loader documentation](https://vue-loader.vuejs.org/en/workflow/testing.html).

+ 2 - 2
docs/ja/README.md

@@ -6,7 +6,7 @@ Vuex は Vue.js アプリケーションのための **状態管理パターン
 これは予測可能な方法によってのみ状態の変異を行うというルールを保証し、アプリケーション内の全てのコンポーネントのための集中型のストアとして機能します。
 これは予測可能な方法によってのみ状態の変異を行うというルールを保証し、アプリケーション内の全てのコンポーネントのための集中型のストアとして機能します。
 また Vue 公式の[開発ツール拡張](https://github.com/vuejs/vue-devtools)と連携し、設定なしでタイムトラベルデバッグやステートのスナップショットのエクスポートやインポートのような高度な機能を提供します。
 また Vue 公式の[開発ツール拡張](https://github.com/vuejs/vue-devtools)と連携し、設定なしでタイムトラベルデバッグやステートのスナップショットのエクスポートやインポートのような高度な機能を提供します。
 
 
-### "状態管理パターン"とはなんですか?
+## "状態管理パターン"とはなんですか?
 
 
 単純な Vue で作られたカウンターアプリをみてみましょう:
 単純な Vue で作られたカウンターアプリをみてみましょう:
 
 
@@ -61,7 +61,7 @@ new Vue({
 
 
 ![vuex](/vuex.png)
 ![vuex](/vuex.png)
 
 
-### いつ、Vuexを使うべきでしょうか?
+## いつ、Vuexを使うべきでしょうか?
 
 
 Vuex は、共有状態の管理に役立ちますが、さらに概念やボイラープレートのコストがかかります。これは、短期的生産性と長期的生産性のトレードオフです。
 Vuex は、共有状態の管理に役立ちますが、さらに概念やボイラープレートのコストがかかります。これは、短期的生産性と長期的生産性のトレードオフです。
 
 

+ 1 - 1
docs/ja/guide/README.md

@@ -8,7 +8,7 @@ Vuex アプリケーションの中心にあるものは**ストア**です。"
 
 
 2. ストアの状態を直接変更することはできません。明示的に**ミューテーションをコミットする**ことによってのみ、ストアの状態を変更します。これによって、全ての状態の変更について追跡可能な記録を残すことが保証され、ツールでのアプリケーションの動作の理解を助けます。
 2. ストアの状態を直接変更することはできません。明示的に**ミューテーションをコミットする**ことによってのみ、ストアの状態を変更します。これによって、全ての状態の変更について追跡可能な記録を残すことが保証され、ツールでのアプリケーションの動作の理解を助けます。
 
 
-### シンプルなストア
+## シンプルなストア
 
 
 :::tip 注意
 :::tip 注意
 私たちは、このドキュメントのコード例に ES2015 のシンタックスを利用しています。 もし触れたことがなければ、[ぜひ触れてください](https://babeljs.io/docs/learn-es2015/)!
 私たちは、このドキュメントのコード例に ES2015 のシンタックスを利用しています。 もし触れたことがなければ、[ぜひ触れてください](https://babeljs.io/docs/learn-es2015/)!

+ 3 - 3
docs/ja/guide/actions.md

@@ -39,7 +39,7 @@ actions: {
 }
 }
 ```
 ```
 
 
-### アクションのディスパッチ
+## アクションのディスパッチ
 
 
 アクションは `store.dispatch` がトリガーとなって実行されます:
 アクションは `store.dispatch` がトリガーとなって実行されます:
 
 
@@ -97,7 +97,7 @@ actions: {
 
 
 一連の非同期の処理を実行しつつ、ミューテーションのコミットによってのみ副作用(状態の変更)を与えていることに注意してください。
 一連の非同期の処理を実行しつつ、ミューテーションのコミットによってのみ副作用(状態の変更)を与えていることに注意してください。
 
 
-### コンポーネント内でのアクションのディスパッチ
+## コンポーネント内でのアクションのディスパッチ
 
 
 `this.$store.dispatch('xxx')` でコンポーネント内でアクションをディスパッチできます。あるいはコンポーネントのメソッドを `store.dispatch` にマッピングする `mapActions` ヘルパーを使うこともできます(ルートの `store` の注入が必要です):
 `this.$store.dispatch('xxx')` でコンポーネント内でアクションをディスパッチできます。あるいはコンポーネントのメソッドを `store.dispatch` にマッピングする `mapActions` ヘルパーを使うこともできます(ルートの `store` の注入が必要です):
 
 
@@ -119,7 +119,7 @@ export default {
 }
 }
 ```
 ```
 
 
-### アクションを構成する
+## アクションを構成する
 
 
 アクションはしばしば非同期処理を行いますが、アクションが完了したことをどうやって知れば良いのでしょう?そしてもっと重要なことは、さらに複雑な非同期処理を取り扱うために、どうやって複数のアクションを構成させるかということです。
 アクションはしばしば非同期処理を行いますが、アクションが完了したことをどうやって知れば良いのでしょう?そしてもっと重要なことは、さらに複雑な非同期処理を取り扱うために、どうやって複数のアクションを構成させるかということです。
 
 

+ 1 - 1
docs/ja/guide/forms.md

@@ -40,7 +40,7 @@ mutations: {
 }
 }
 ```
 ```
 
 
-### 双方向算出プロパティ
+## 双方向算出プロパティ
 
 
 確かに、上記の例は単純な `v-model` と ローカルステートよりもかなり冗長で、`v-model` のいくつかの有用な機能が使えません。代わりに、セッターで双方向算出プロパティを使うアプローチがあります。
 確かに、上記の例は単純な `v-model` と ローカルステートよりもかなり冗長で、`v-model` のいくつかの有用な機能が使えません。代わりに、セッターで双方向算出プロパティを使うアプローチがあります。
 
 

+ 3 - 3
docs/ja/guide/getters.md

@@ -34,7 +34,7 @@ const store = new Vuex.Store({
 })
 })
 ```
 ```
 
 
-### プロパティスタイルアクセス
+## プロパティスタイルアクセス
 
 
 ゲッターは `store.getters` オブジェクトから取り出され、プロパティとしてアクセスすることができます:
 ゲッターは `store.getters` オブジェクトから取り出され、プロパティとしてアクセスすることができます:
 
 
@@ -69,7 +69,7 @@ computed: {
 
 
 プロパティとしてアクセスされるゲッターは Vue のリアクティブシステムの一部としてキャッシュされるという点に留意してください。
 プロパティとしてアクセスされるゲッターは Vue のリアクティブシステムの一部としてキャッシュされるという点に留意してください。
 
 
-### メソッドスタイルアクセス
+## メソッドスタイルアクセス
 
 
 関数を返り値にすることで、ゲッターに引数を渡すこともできます。これは特にストアの中の配列を検索する時に役立ちます:
 関数を返り値にすることで、ゲッターに引数を渡すこともできます。これは特にストアの中の配列を検索する時に役立ちます:
 ```js
 ```js
@@ -87,7 +87,7 @@ store.getters.getTodoById(2) // -> { id: 2, text: '...', done: false }
 
 
 メソッドによってアクセスされるゲッターは呼び出す度に実行され、その結果はキャッシュされない点に留意してください。
 メソッドによってアクセスされるゲッターは呼び出す度に実行され、その結果はキャッシュされない点に留意してください。
 
 
-### `mapGetters` ヘルパー
+## `mapGetters` ヘルパー
 
 
 `mapGetters` ヘルパーはストアのゲッターをローカルの算出プロパティにマッピングさせます:
 `mapGetters` ヘルパーはストアのゲッターをローカルの算出プロパティにマッピングさせます:
 
 

+ 9 - 9
docs/ja/guide/modules.md

@@ -31,7 +31,7 @@ store.state.a // -> `moduleA` のステート
 store.state.b // -> `moduleB` のステート
 store.state.b // -> `moduleB` のステート
 ```
 ```
 
 
-### モジュールのローカルステート
+## モジュールのローカルステート
 
 
 モジュールのミューテーションやゲッターの中では、渡される第1引数は**モジュールのローカルステート**です。
 モジュールのミューテーションやゲッターの中では、渡される第1引数は**モジュールのローカルステート**です。
 
 
@@ -83,7 +83,7 @@ const moduleA = {
 }
 }
 ```
 ```
 
 
-### 名前空間
+## 名前空間
 
 
 デフォルトでは、モジュール内部のアクション、ミューテーション、そしてゲッターは**グローバル名前空間**の元で登録されます - これにより、複数のモジュールが同じミューテーション/アクションタイプに反応することができます。
 デフォルトでは、モジュール内部のアクション、ミューテーション、そしてゲッターは**グローバル名前空間**の元で登録されます - これにより、複数のモジュールが同じミューテーション/アクションタイプに反応することができます。
 
 
@@ -134,7 +134,7 @@ const store = new Vuex.Store({
 
 
 名前空間のゲッターとアクションは、ローカライズされた `getters`、`dispatch`、`commit` を受け取ります。言い換えれば、同じモジュールに接頭辞 (prefix) を書き込まずに、モジュールアセットを使用することができます。名前空間オプションの切り替えは、モジュール内のコードには影響しません。
 名前空間のゲッターとアクションは、ローカライズされた `getters`、`dispatch`、`commit` を受け取ります。言い換えれば、同じモジュールに接頭辞 (prefix) を書き込まずに、モジュールアセットを使用することができます。名前空間オプションの切り替えは、モジュール内のコードには影響しません。
 
 
-#### 名前空間付きモジュールでのグローバルアセットへのアクセス
+### 名前空間付きモジュールでのグローバルアセットへのアクセス
 
 
 グローバルステートとゲッターを使いたい場合、`rootState` と `rootGetters` はゲッター関数の第3引数と第4引数として渡され、アクション関数に渡される `context` オブジェクトのプロパティとしても公開されます。
 グローバルステートとゲッターを使いたい場合、`rootState` と `rootGetters` はゲッター関数の第3引数と第4引数として渡され、アクション関数に渡される `context` オブジェクトのプロパティとしても公開されます。
 
 
@@ -174,7 +174,7 @@ modules: {
 }
 }
 ```
 ```
 
 
-#### 名前空間付きモジュールでのグローバルアクションへの登録
+### 名前空間付きモジュールでのグローバルアクションへの登録
 
 
 名前空間付きモジュールでグローバルアクションに登録したい場合、`root: true` でそれをマークでき、そしてアクション定義を `handler` 関数に置くことができます。例えば:
 名前空間付きモジュールでグローバルアクションに登録したい場合、`root: true` でそれをマークでき、そしてアクション定義を `handler` 関数に置くことができます。例えば:
 
 
@@ -200,7 +200,7 @@ modules: {
 ```
 ```
 
 
 
 
-#### 名前空間によるバインディングヘルパー
+### 名前空間によるバインディングヘルパー
 
 
 `mapState`、`mapGetters`、`mapActions`、そして `mapMutations` ヘルパーを使って名前空間付きモジュールをコンポーネントにバインディングするとき、少し冗長になります:
 `mapState`、`mapGetters`、`mapActions`、そして `mapMutations` ヘルパーを使って名前空間付きモジュールをコンポーネントにバインディングするとき、少し冗長になります:
 
 
@@ -261,7 +261,7 @@ export default {
 }
 }
 ```
 ```
 
 
-#### プラグイン開発者向けの注意事項
+### プラグイン開発者向けの注意事項
 
 
 モジュールを提供する[プラグイン](plugins.md)を作成し、ユーザーがそれらを Vuex ストアに追加できるようにすると、モジュールの予測できない名前空間が気になるかもしれません。あなたのモジュールは、プラグインユーザーが名前空間付きモジュールの元にモジュールを追加すると、その名前空間に属するようになります。この状況に適応するには、プラグインオプションを使用して名前空間の値を受け取る必要があります。
 モジュールを提供する[プラグイン](plugins.md)を作成し、ユーザーがそれらを Vuex ストアに追加できるようにすると、モジュールの予測できない名前空間が気になるかもしれません。あなたのモジュールは、プラグインユーザーが名前空間付きモジュールの元にモジュールを追加すると、その名前空間に属するようになります。この状況に適応するには、プラグインオプションを使用して名前空間の値を受け取る必要があります。
 
 
@@ -277,7 +277,7 @@ export function createPlugin (options = {}) {
 }
 }
 ```
 ```
 
 
-### 動的にモジュールを登録する
+## 動的にモジュールを登録する
 
 
 ストアが作られた**後**に `store.registerModule` メソッドを使って、モジュールを登録できます:
 ストアが作られた**後**に `store.registerModule` メソッドを使って、モジュールを登録できます:
 
 
@@ -301,13 +301,13 @@ store.registerModule(['nested', 'myModule'], {
 
 
 また、すでにモジュールが登録されているかどうかを `store.hasModule(moduleName)` メソッドを使って確認することができます。
 また、すでにモジュールが登録されているかどうかを `store.hasModule(moduleName)` メソッドを使って確認することができます。
 
 
-#### ステートの保持
+### ステートの保持
 
 
 サーバサイドレンダリングされたアプリケーションから状態を保持するなど、新しいモジュールを登録するときに、以前の状態を保持したい場合があります。`preserveState` オプション(`store.registerModule('a', module, { preserveState: true })`)でこれを実現できます。
 サーバサイドレンダリングされたアプリケーションから状態を保持するなど、新しいモジュールを登録するときに、以前の状態を保持したい場合があります。`preserveState` オプション(`store.registerModule('a', module, { preserveState: true })`)でこれを実現できます。
 
 
 `preserveState: true` を設定した場合、モジュールを登録する際に、アクション、ミューテーション、そしてゲッターは追加されますがステートは追加されません。これはストアのステートはすでにモジュールのステートを登録しているので、それを上書きしないようにするためです。
 `preserveState: true` を設定した場合、モジュールを登録する際に、アクション、ミューテーション、そしてゲッターは追加されますがステートは追加されません。これはストアのステートはすでにモジュールのステートを登録しているので、それを上書きしないようにするためです。
 
 
-### モジュールの再利用
+## モジュールの再利用
 
 
 時どき、モジュールの複数インスタンスを作成する必要があるかもしれません。例えば:
 時どき、モジュールの複数インスタンスを作成する必要があるかもしれません。例えば:
 
 

+ 7 - 7
docs/ja/guide/mutations.md

@@ -24,7 +24,7 @@ const store = new Vuex.Store({
 store.commit('increment')
 store.commit('increment')
 ```
 ```
 
 
-### 追加の引数を渡してコミットする
+## 追加の引数を渡してコミットする
 
 
 `store.commit` に追加の引数を渡すこともできます。この追加の引数は、特定のミューテーションに対する**ペイロード**と呼びます:
 `store.commit` に追加の引数を渡すこともできます。この追加の引数は、特定のミューテーションに対する**ペイロード**と呼びます:
 
 
@@ -58,7 +58,7 @@ store.commit('increment', {
 })
 })
 ```
 ```
 
 
-### オブジェクトスタイルのコミット
+## オブジェクトスタイルのコミット
 
 
 また `type` プロパティを持つオブジェクトを使って、ミューテーションをコミットすることもできます:
 また `type` プロパティを持つオブジェクトを使って、ミューテーションをコミットすることもできます:
 
 
@@ -80,7 +80,7 @@ mutations: {
 ```
 ```
 
 
 
 
-### Vue のリアクティブなルールに則ったミューテーション
+## Vue のリアクティブなルールに則ったミューテーション
 
 
 Vuex ストアの状態は Vue によってリアクティブになっているので、状態を変更すると、状態を監視している Vue コンポーネントは自動的に更新されます。これは Vuex のミューテーションは、通常の Vue と動作させているときと同じく、リアクティブな値に関する注意が必要であることを意味します:
 Vuex ストアの状態は Vue によってリアクティブになっているので、状態を変更すると、状態を監視している Vue コンポーネントは自動的に更新されます。これは Vuex のミューテーションは、通常の Vue と動作させているときと同じく、リアクティブな値に関する注意が必要であることを意味します:
 
 
@@ -96,7 +96,7 @@ Vuex ストアの状態は Vue によってリアクティブになっている
     state.obj = { ...state.obj, newProp: 123 }
     state.obj = { ...state.obj, newProp: 123 }
     ```
     ```
 
 
-### ミューテーション・タイプに定数を使用する
+## ミューテーション・タイプに定数を使用する
 
 
 いろいろな Flux 実装において、ミューテーション・タイプに定数を使用することが共通して見られるパターンです。これはコードに対してリントツールのようなツールを利用できるという利点があり、また単一ファイルに全ての定数を設定することによって、共同で作業する人に、アプリケーション全体で何のミューテーションが可能であるかを一目見ただけで理解できるようにします:
 いろいろな Flux 実装において、ミューテーション・タイプに定数を使用することが共通して見られるパターンです。これはコードに対してリントツールのようなツールを利用できるという利点があり、また単一ファイルに全ての定数を設定することによって、共同で作業する人に、アプリケーション全体で何のミューテーションが可能であるかを一目見ただけで理解できるようにします:
 
 
@@ -123,7 +123,7 @@ const store = new Vuex.Store({
 
 
 定数を使用するかどうかは好みの問題です。多くの開発者による大規模なプロジェクトで役に立ちますが、完全にオプションなので、もしお気に召さなければ使用しなくても構いません。
 定数を使用するかどうかは好みの問題です。多くの開発者による大規模なプロジェクトで役に立ちますが、完全にオプションなので、もしお気に召さなければ使用しなくても構いません。
 
 
-### ミューテーションは同期的でなければならない
+## ミューテーションは同期的でなければならない
 
 
 ひとつの重要なルールを覚えておきましょう。それは**ミューテーションハンドラ関数は同期的でなければならない**ということです。なぜか?次の例で考えてみましょう:
 ひとつの重要なルールを覚えておきましょう。それは**ミューテーションハンドラ関数は同期的でなければならない**ということです。なぜか?次の例で考えてみましょう:
 
 
@@ -139,7 +139,7 @@ mutations: {
 
 
 いま、開発ツールのミューテーションのログを見ながら、アプリケーションのデバッグを行っていることを想像してください。全てのミューテーションをログに記録するためには、ミューテーションの前後の状態のスナップショットを捕捉することが必要です。しかし、上の例にあるミューテーション内の非同期コールバックは、それを不可能にします: そのコールバックは、ミューテーションがコミットされた時点ではまだ呼び出されていません。そして、コールバックが実際にいつ呼び出されるかを、開発ツールは知る術がありません。いかなる状態変更でも、コールバック内で起きる場合は本質的に追跡不可能です。
 いま、開発ツールのミューテーションのログを見ながら、アプリケーションのデバッグを行っていることを想像してください。全てのミューテーションをログに記録するためには、ミューテーションの前後の状態のスナップショットを捕捉することが必要です。しかし、上の例にあるミューテーション内の非同期コールバックは、それを不可能にします: そのコールバックは、ミューテーションがコミットされた時点ではまだ呼び出されていません。そして、コールバックが実際にいつ呼び出されるかを、開発ツールは知る術がありません。いかなる状態変更でも、コールバック内で起きる場合は本質的に追跡不可能です。
 
 
-### コンポーネント内におけるミューテーションのコミット
+## コンポーネント内におけるミューテーションのコミット
 
 
 `this.$store.commit('xxx')` と書くか、もしくはコンポーネントのメソッドを `store.commit` にマッピングする `mapMutations` ヘルパーを呼び出すこと(ルートの `store` の注入が必要)で、コンポーネント内でミューテーションをコミットできます:
 `this.$store.commit('xxx')` と書くか、もしくはコンポーネントのメソッドを `store.commit` にマッピングする `mapMutations` ヘルパーを呼び出すこと(ルートの `store` の注入が必要)で、コンポーネント内でミューテーションをコミットできます:
 
 
@@ -162,7 +162,7 @@ export default {
 }
 }
 ```
 ```
 
 
-### アクションへ向けて
+## アクションへ向けて
 
 
 状態変更を非同期に組み合わせることは、プログラムの動きを予測することを非常に困難にします。例えば、状態を変更する非同期コールバックを持った 2つのメソッドを両方呼び出すとき、それらがいつ呼び出されたか、どちらが先に呼び出されたかを、どうやって知ればよいのでしょう?これがまさに、状態変更と非同期の 2つの概念を分離したいという理由です。Vuex では**全てのミューテーションは同期的に行う**という作法になっています:
 状態変更を非同期に組み合わせることは、プログラムの動きを予測することを非常に困難にします。例えば、状態を変更する非同期コールバックを持った 2つのメソッドを両方呼び出すとき、それらがいつ呼び出されたか、どちらが先に呼び出されたかを、どうやって知ればよいのでしょう?これがまさに、状態変更と非同期の 2つの概念を分離したいという理由です。Vuex では**全てのミューテーションは同期的に行う**という作法になっています:
 
 

+ 3 - 3
docs/ja/guide/plugins.md

@@ -23,7 +23,7 @@ const store = new Vuex.Store({
 })
 })
 ```
 ```
 
 
-### プラグイン内でのミューテーションのコミット
+## プラグイン内でのミューテーションのコミット
 
 
 プラグインは直接、状態を変更できません。これはコンポーネントに似ています。プラグインはコンポーネント同様に、ミューテーションのコミットをトリガーすることで状態を変更できます。
 プラグインは直接、状態を変更できません。これはコンポーネントに似ています。プラグインはコンポーネント同様に、ミューテーションのコミットをトリガーすることで状態を変更できます。
 
 
@@ -54,7 +54,7 @@ const store = new Vuex.Store({
 })
 })
 ```
 ```
 
 
-### 状態のスナップショットを撮る
+## 状態のスナップショットを撮る
 
 
 時々、状態の"スナップショット"を撮って、ミューテーション前後の状態を比較したくなることがあるでしょう。それを実現するために、状態オブジェクトのディープコピーを行う必要があります:
 時々、状態の"スナップショット"を撮って、ミューテーション前後の状態を比較したくなることがあるでしょう。それを実現するために、状態オブジェクトのディープコピーを行う必要があります:
 
 
@@ -85,7 +85,7 @@ const store = new Vuex.Store({
 
 
 上のように記述すれば、プラグインはデフォルトで利用されることになります。本番環境( production ) では、 `process.env.NODE_ENV !== 'production'` を `false` に置き換えるために、 webpack では[DefinePlugin](https://webpack.js.org/plugins/define-plugin/) 、 Browserify では[envify](https://github.com/hughsk/envify) が必要になります。
 上のように記述すれば、プラグインはデフォルトで利用されることになります。本番環境( production ) では、 `process.env.NODE_ENV !== 'production'` を `false` に置き換えるために、 webpack では[DefinePlugin](https://webpack.js.org/plugins/define-plugin/) 、 Browserify では[envify](https://github.com/hughsk/envify) が必要になります。
 
 
-### ビルトインロガープラグイン
+## ビルトインロガープラグイン
 
 
 > もし、あなたが [vue-devtools](https://github.com/vuejs/vue-devtools) を使っている場合は、これは不要でしょう。
 > もし、あなたが [vue-devtools](https://github.com/vuejs/vue-devtools) を使っている場合は、これは不要でしょう。
 
 

+ 5 - 5
docs/ja/guide/state.md

@@ -1,6 +1,6 @@
 # ステート
 # ステート
 
 
-### 単一ステートツリー
+## 単一ステートツリー
 
 
 <div class="scrimba"><a href="https://scrimba.com/p/pnyzgAP/cWw3Zhb" target="_blank" rel="noopener noreferrer">Scrimba のレッスンを試す</a></div>
 <div class="scrimba"><a href="https://scrimba.com/p/pnyzgAP/cWw3Zhb" target="_blank" rel="noopener noreferrer">Scrimba のレッスンを試す</a></div>
 
 
@@ -8,7 +8,7 @@ Vuex は **単一ステートツリー (single state tree)** を使います。
 
 
 単一ステートツリーはモジュール性と競合しません。以降の章で、アプリケーションの状態とミューテーション(変更)をサブモジュールに分割する方法について説明します。
 単一ステートツリーはモジュール性と競合しません。以降の章で、アプリケーションの状態とミューテーション(変更)をサブモジュールに分割する方法について説明します。
 
 
-### Vuex の状態を Vue コンポーネントに入れる
+## Vuex の状態を Vue コンポーネントに入れる
 
 
 ストアにある状態を Vue コンポーネント に表示するにはどうすればよいのでしょう? Vuex ストア はリアクティブなので、ストアから状態を"取り出す"一番シンプルな方法は、単純にいくつかのストアの状態を [算出プロパティ](https://jp.vuejs.org/guide/computed.html) で返すことです。
 ストアにある状態を Vue コンポーネント に表示するにはどうすればよいのでしょう? Vuex ストア はリアクティブなので、ストアから状態を"取り出す"一番シンプルな方法は、単純にいくつかのストアの状態を [算出プロパティ](https://jp.vuejs.org/guide/computed.html) で返すことです。
 
 
@@ -57,7 +57,7 @@ const Counter = {
 }
 }
 ```
 ```
 
 
-### `mapState`  ヘルパー
+## `mapState`  ヘルパー
 
 
 <div class="scrimba"><a href="https://scrimba.com/p/pnyzgAP/c8Pz7BSK" target="_blank" rel="noopener noreferrer">Scrimba のレッスンを試す</a></div>
 <div class="scrimba"><a href="https://scrimba.com/p/pnyzgAP/c8Pz7BSK" target="_blank" rel="noopener noreferrer">Scrimba のレッスンを試す</a></div>
 
 
@@ -91,7 +91,7 @@ computed: mapState([
 ])
 ])
 ```
 ```
 
 
-### オブジェクトスプレッド演算子
+## オブジェクトスプレッド演算子
 
 
 `mapState` はオブジェクトを返すことに注意しましょう。どうやって、他のローカル算出プロパティと組み合わせるのでしょうか? 通常、最終的にひとつのオブジェクトを `computed` に渡せるように、複数のオブジェクトをひとつにマージするユーティリティを使わなければいけません。しかし、[オブジェクトスプレッド演算子](https://github.com/tc39/proposal-object-rest-spread)で、シンタックスをかなり単純にできます:
 `mapState` はオブジェクトを返すことに注意しましょう。どうやって、他のローカル算出プロパティと組み合わせるのでしょうか? 通常、最終的にひとつのオブジェクトを `computed` に渡せるように、複数のオブジェクトをひとつにマージするユーティリティを使わなければいけません。しかし、[オブジェクトスプレッド演算子](https://github.com/tc39/proposal-object-rest-spread)で、シンタックスをかなり単純にできます:
 
 
@@ -105,6 +105,6 @@ computed: {
 }
 }
 ```
 ```
 
 
-### コンポーネントはまだローカルステートを持つことできる
+## コンポーネントはまだローカルステートを持つことできる
 
 
 Vuex を使うということは、**全て**の状態を Vuex の中に置くべき、というわけではありません。多くの状態を Vuex に置くことで、状態の変更がさらに明示的、デバッグ可能になりますが、ときにはコードを冗長でまわりくどいものにします。状態の一部がひとつのコンポーネントだけに属している場合は、それをローカルの状態として残しておくとよいでしょう。あなたは、トレードオフを考慮した上で、あなたのアプリの開発ニーズに合った決定をすべきです。
 Vuex を使うということは、**全て**の状態を Vuex の中に置くべき、というわけではありません。多くの状態を Vuex に置くことで、状態の変更がさらに明示的、デバッグ可能になりますが、ときにはコードを冗長でまわりくどいものにします。状態の一部がひとつのコンポーネントだけに属している場合は、それをローカルの状態として残しておくとよいでしょう。あなたは、トレードオフを考慮した上で、あなたのアプリの開発ニーズに合った決定をすべきです。

+ 1 - 1
docs/ja/guide/strict.md

@@ -11,7 +11,7 @@ const store = new Vuex.Store({
 
 
 厳格モードでは Vuex の状態がミューテーションハンドラの外部で変更されたら、エラーを投げるようになります。これで全ての状態変更がデバッギングツールで明示的に追跡できることが保証されます。
 厳格モードでは Vuex の状態がミューテーションハンドラの外部で変更されたら、エラーを投げるようになります。これで全ての状態変更がデバッギングツールで明示的に追跡できることが保証されます。
 
 
-### 開発環境 vs 本番環境
+## 開発環境 vs 本番環境
 
 
 **本番環境で厳格モードを有効にしてデプロイしてはいけません!** 厳格モードでは不適切なミューテーションを検出するためにステートツリーに対して深い監視を実行します。パフォーマンスコストを回避するために本番環境では無効にしてください。
 **本番環境で厳格モードを有効にしてデプロイしてはいけません!** 厳格モードでは不適切なミューテーションを検出するためにステートツリーに対して深い監視を実行します。パフォーマンスコストを回避するために本番環境では無効にしてください。
 
 

+ 7 - 7
docs/ja/guide/testing.md

@@ -4,7 +4,7 @@
 
 
 私たちが Vuex でユニットテストしたい主な部分はミューテーションとアクションです。
 私たちが Vuex でユニットテストしたい主な部分はミューテーションとアクションです。
 
 
-### ミューテーションのテスト
+## ミューテーションのテスト
 
 
 ミューテーションは完全に引数に依存しているだけの関数であるため、テストするのがとても簡単です。効果的なやり方として、もし ES2015 のモジュールを使っていて `store.js` ファイルの中にミューテーションがあるなら、デフォルトエクスポートに加えて、名前付きエクスポートでミューテーションをエクスポートできます。
 ミューテーションは完全に引数に依存しているだけの関数であるため、テストするのがとても簡単です。効果的なやり方として、もし ES2015 のモジュールを使っていて `store.js` ファイルの中にミューテーションがあるなら、デフォルトエクスポートに加えて、名前付きエクスポートでミューテーションをエクスポートできます。
 
 
@@ -49,7 +49,7 @@ describe('mutations', () => {
 })
 })
 ```
 ```
 
 
-### アクションのテスト
+## アクションのテスト
 
 
 アクションは外部の API を呼び出す可能性があるため、ミューテーションのテストよりも少し注意が必要です。アクションをテストするとき、通常、いくつかの段階でモックを作る必要があります。例えば API 呼び出しをサービスとして抽象化し、そしてテストの内部ではそのサービスをモックにすることができます。簡単に依存関係をモック化するために、webpack と [inject-loader](https://github.com/plasticine/inject-loader) を使ってテストファイルをバンドルすることができます。
 アクションは外部の API を呼び出す可能性があるため、ミューテーションのテストよりも少し注意が必要です。アクションをテストするとき、通常、いくつかの段階でモックを作る必要があります。例えば API 呼び出しをサービスとして抽象化し、そしてテストの内部ではそのサービスをモックにすることができます。簡単に依存関係をモック化するために、webpack と [inject-loader](https://github.com/plasticine/inject-loader) を使ってテストファイルをバンドルすることができます。
 
 
@@ -144,7 +144,7 @@ describe('actions', () => {
 })
 })
 ```
 ```
 
 
-### ゲッターのテスト
+## ゲッターのテスト
 
 
 もしゲッターが複雑な計算を行っているならば、テストコードを書く価値があります。ゲッターはミューテーションと同様の理由でテストしやすいです。
 もしゲッターが複雑な計算を行っているならば、テストコードを書く価値があります。ゲッターはミューテーションと同様の理由でテストしやすいです。
 
 
@@ -191,11 +191,11 @@ describe('getters', () => {
 })
 })
 ```
 ```
 
 
-### テストの実行
+## テストの実行
 
 
 ミューテーションやアクションが適切に書かれている場合は、適切にモック化された後、テストコードはブラウザの API に直接依存関係を持つことはないでしょう。したがって、単純に webpack でテストをバンドルでき、それを直接 Node で実行できます。別の方法として、本当のブラウザでテストを実行するためには `mocha-loader` または Karma + `karma-webpack` を使用できます。
 ミューテーションやアクションが適切に書かれている場合は、適切にモック化された後、テストコードはブラウザの API に直接依存関係を持つことはないでしょう。したがって、単純に webpack でテストをバンドルでき、それを直接 Node で実行できます。別の方法として、本当のブラウザでテストを実行するためには `mocha-loader` または Karma + `karma-webpack` を使用できます。
 
 
-#### Node での実行
+### Node での実行
 
 
 以下のような webpack の設定を作成します([`.babelrc`](https://babeljs.io/docs/usage/babelrc/) もあわせて使います):
 以下のような webpack の設定を作成します([`.babelrc`](https://babeljs.io/docs/usage/babelrc/) もあわせて使います):
 
 
@@ -226,13 +226,13 @@ webpack
 mocha test-bundle.js
 mocha test-bundle.js
 ```
 ```
 
 
-#### ブラウザでの実行
+### ブラウザでの実行
 
 
 1. `mocha-loader` をインストールする
 1. `mocha-loader` をインストールする
 2. 上記 webpack 設定から `entry` を `'mocha-loader!babel-loader!./test.js'` に変更する
 2. 上記 webpack 設定から `entry` を `'mocha-loader!babel-loader!./test.js'` に変更する
 3. 設定を使用して `webpack-dev-server` を開始する
 3. 設定を使用して `webpack-dev-server` を開始する
 4. ブラウザで `localhost:8080/webpack-dev-server/test-bundle` を開く
 4. ブラウザで `localhost:8080/webpack-dev-server/test-bundle` を開く
 
 
-#### Karma + karma-webpack を使ったブラウザでの実行
+### Karma + karma-webpack を使ったブラウザでの実行
 
 
 [vue-loader ドキュメント](https://vue-loader.vuejs.org/ja/workflow/testing.html) 内のセットアップ方法を参考にしてください。
 [vue-loader ドキュメント](https://vue-loader.vuejs.org/ja/workflow/testing.html) 内のセットアップ方法を参考にしてください。

+ 5 - 5
docs/ja/installation.md

@@ -1,6 +1,6 @@
 # インストール
 # インストール
 
 
-### 直接ダウンロードする / CDN
+## 直接ダウンロードする / CDN
 
 
 [https://unpkg.com/vuex](https://unpkg.com/vuex)
 [https://unpkg.com/vuex](https://unpkg.com/vuex)
 
 
@@ -15,13 +15,13 @@ Vue のあとで `vuex` を取り込むと自動的に Vuex が導入されま
 <script src="/path/to/vuex.js"></script>
 <script src="/path/to/vuex.js"></script>
 ```
 ```
 
 
-### NPM
+## NPM
 
 
 ``` bash
 ``` bash
 npm install vuex --save
 npm install vuex --save
 ```
 ```
 
 
-### Yarn
+## Yarn
 
 
 ``` bash
 ``` bash
 yarn add vuex
 yarn add vuex
@@ -38,7 +38,7 @@ Vue.use(Vuex)
 
 
 グローバルなスクリプトタグを利用する場合にはこのようにする必要はありません。
 グローバルなスクリプトタグを利用する場合にはこのようにする必要はありません。
 
 
-### Promise
+## Promise
 
 
 Vuex は [Promise (プロミス)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises) を必要とします。ブラウザで Promise が実装されていない(例 IE)場合は、[es6-promise](https://github.com/stefanpenner/es6-promise) のようなポリフィルライブラリを使用できます。
 Vuex は [Promise (プロミス)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises) を必要とします。ブラウザで Promise が実装されていない(例 IE)場合は、[es6-promise](https://github.com/stefanpenner/es6-promise) のようなポリフィルライブラリを使用できます。
 
 
@@ -63,7 +63,7 @@ yarn add es6-promise # Yarn
 import 'es6-promise/auto'
 import 'es6-promise/auto'
 ```
 ```
 
 
-### 開発版ビルド
+## 開発版ビルド
 
 
 最新の開発版ビルドを利用したい場合には、 Github から直接クローンし `vuex` を自身でビルドする必要があります。
 最新の開発版ビルドを利用したい場合には、 Github から直接クローンし `vuex` を自身でビルドする必要があります。
 
 

+ 2 - 2
docs/zh/README.md

@@ -2,7 +2,7 @@
 
 
 Vuex 是一个专为 Vue.js 应用程序开发的**状态管理模式**。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 [devtools extension](https://github.com/vuejs/vue-devtools),提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。
 Vuex 是一个专为 Vue.js 应用程序开发的**状态管理模式**。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 [devtools extension](https://github.com/vuejs/vue-devtools),提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。
 
 
-### 什么是“状态管理模式”?
+## 什么是“状态管理模式”?
 
 
 让我们从一个简单的 Vue 计数应用开始:
 让我们从一个简单的 Vue 计数应用开始:
 
 
@@ -56,7 +56,7 @@ new Vue({
 
 
 ![vuex](/vuex.png)
 ![vuex](/vuex.png)
 
 
-### 什么情况下我应该使用 Vuex?
+## 什么情况下我应该使用 Vuex?
 
 
 Vuex 可以帮助我们管理共享状态,并附带了更多的概念和框架。这需要对短期和长期效益进行权衡。
 Vuex 可以帮助我们管理共享状态,并附带了更多的概念和框架。这需要对短期和长期效益进行权衡。
 
 

+ 1 - 1
docs/zh/guide/README.md

@@ -8,7 +8,7 @@
 
 
 2. 你不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地**提交 (commit) mutation**。这样使得我们可以方便地跟踪每一个状态的变化,从而让我们能够实现一些工具帮助我们更好地了解我们的应用。
 2. 你不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地**提交 (commit) mutation**。这样使得我们可以方便地跟踪每一个状态的变化,从而让我们能够实现一些工具帮助我们更好地了解我们的应用。
 
 
-### 最简单的 Store
+## 最简单的 Store
 
 
 :::tip 提示
 :::tip 提示
 我们将在后续的文档示例代码中使用 ES2015 语法。如果你还没能掌握 ES2015,[你得抓紧了](https://babeljs.io/docs/learn-es2015/)!
 我们将在后续的文档示例代码中使用 ES2015 语法。如果你还没能掌握 ES2015,[你得抓紧了](https://babeljs.io/docs/learn-es2015/)!

+ 3 - 3
docs/zh/guide/actions.md

@@ -39,7 +39,7 @@ actions: {
 }
 }
 ```
 ```
 
 
-### 分发 Action
+## 分发 Action
 
 
 Action 通过 `store.dispatch` 方法触发:
 Action 通过 `store.dispatch` 方法触发:
 
 
@@ -97,7 +97,7 @@ actions: {
 
 
 注意我们正在进行一系列的异步操作,并且通过提交 mutation 来记录 action 产生的副作用(即状态变更)。
 注意我们正在进行一系列的异步操作,并且通过提交 mutation 来记录 action 产生的副作用(即状态变更)。
 
 
-### 在组件中分发 Action
+## 在组件中分发 Action
 
 
 你在组件中使用 `this.$store.dispatch('xxx')` 分发 action,或者使用 `mapActions` 辅助函数将组件的 methods 映射为 `store.dispatch` 调用(需要先在根节点注入 `store`):
 你在组件中使用 `this.$store.dispatch('xxx')` 分发 action,或者使用 `mapActions` 辅助函数将组件的 methods 映射为 `store.dispatch` 调用(需要先在根节点注入 `store`):
 
 
@@ -120,7 +120,7 @@ export default {
 }
 }
 ```
 ```
 
 
-### 组合 Action
+## 组合 Action
 
 
 Action 通常是异步的,那么如何知道 action 什么时候结束呢?更重要的是,我们如何才能组合多个 action,以处理更加复杂的异步流程?
 Action 通常是异步的,那么如何知道 action 什么时候结束呢?更重要的是,我们如何才能组合多个 action,以处理更加复杂的异步流程?
 
 

+ 1 - 1
docs/zh/guide/forms.md

@@ -40,7 +40,7 @@ mutations: {
 }
 }
 ```
 ```
 
 
-### 双向绑定的计算属性
+## 双向绑定的计算属性
 
 
 必须承认,这样做比简单地使用“`v-model` + 局部状态”要啰嗦得多,并且也损失了一些 `v-model` 中很有用的特性。另一个方法是使用带有 setter 的双向绑定计算属性:
 必须承认,这样做比简单地使用“`v-model` + 局部状态”要啰嗦得多,并且也损失了一些 `v-model` 中很有用的特性。另一个方法是使用带有 setter 的双向绑定计算属性:
 
 

+ 3 - 3
docs/zh/guide/getters.md

@@ -34,7 +34,7 @@ const store = new Vuex.Store({
 })
 })
 ```
 ```
 
 
-### 通过属性访问
+## 通过属性访问
 
 
 Getter 会暴露为 `store.getters` 对象,你可以以属性的形式访问这些值:
 Getter 会暴露为 `store.getters` 对象,你可以以属性的形式访问这些值:
 
 
@@ -69,7 +69,7 @@ computed: {
 
 
 注意,getter 在通过属性访问时是作为 Vue 的响应式系统的一部分缓存其中的。
 注意,getter 在通过属性访问时是作为 Vue 的响应式系统的一部分缓存其中的。
 
 
-### 通过方法访问
+## 通过方法访问
 
 
 你也可以通过让 getter 返回一个函数,来实现给 getter 传参。在你对 store 里的数组进行查询时非常有用。
 你也可以通过让 getter 返回一个函数,来实现给 getter 传参。在你对 store 里的数组进行查询时非常有用。
 
 
@@ -88,7 +88,7 @@ store.getters.getTodoById(2) // -> { id: 2, text: '...', done: false }
 
 
 注意,getter 在通过方法访问时,每次都会去进行调用,而不会缓存结果。
 注意,getter 在通过方法访问时,每次都会去进行调用,而不会缓存结果。
 
 
-### `mapGetters` 辅助函数
+## `mapGetters` 辅助函数
 
 
 `mapGetters` 辅助函数仅仅是将 store 中的 getter 映射到局部计算属性:
 `mapGetters` 辅助函数仅仅是将 store 中的 getter 映射到局部计算属性:
 
 

+ 9 - 9
docs/zh/guide/modules.md

@@ -31,7 +31,7 @@ store.state.a // -> moduleA 的状态
 store.state.b // -> moduleB 的状态
 store.state.b // -> moduleB 的状态
 ```
 ```
 
 
-### 模块的局部状态
+## 模块的局部状态
 
 
 对于模块内部的 mutation 和 getter,接收的第一个参数是**模块的局部状态对象**。
 对于模块内部的 mutation 和 getter,接收的第一个参数是**模块的局部状态对象**。
 
 
@@ -83,7 +83,7 @@ const moduleA = {
 }
 }
 ```
 ```
 
 
-### 命名空间
+## 命名空间
 
 
 默认情况下,模块内部的 action、mutation 和 getter 是注册在**全局命名空间**的——这样使得多个模块能够对同一 mutation 或 action 作出响应。
 默认情况下,模块内部的 action、mutation 和 getter 是注册在**全局命名空间**的——这样使得多个模块能够对同一 mutation 或 action 作出响应。
 
 
@@ -134,7 +134,7 @@ const store = new Vuex.Store({
 
 
 启用了命名空间的 getter 和 action 会收到局部化的 `getter`,`dispatch` 和 `commit`。换言之,你在使用模块内容(module assets)时不需要在同一模块内额外添加空间名前缀。更改 `namespaced` 属性后不需要修改模块内的代码。
 启用了命名空间的 getter 和 action 会收到局部化的 `getter`,`dispatch` 和 `commit`。换言之,你在使用模块内容(module assets)时不需要在同一模块内额外添加空间名前缀。更改 `namespaced` 属性后不需要修改模块内的代码。
 
 
-#### 在带命名空间的模块内访问全局内容(Global Assets)
+### 在带命名空间的模块内访问全局内容(Global Assets)
 
 
 如果你希望使用全局 state 和 getter,`rootState` 和 `rootGetters` 会作为第三和第四参数传入 getter,也会通过 `context` 对象的属性传入 action。
 如果你希望使用全局 state 和 getter,`rootState` 和 `rootGetters` 会作为第三和第四参数传入 getter,也会通过 `context` 对象的属性传入 action。
 
 
@@ -174,7 +174,7 @@ modules: {
 }
 }
 ```
 ```
 
 
-#### 在带命名空间的模块注册全局 action
+### 在带命名空间的模块注册全局 action
 
 
 若需要在带命名空间的模块注册全局 action,你可添加 `root: true`,并将这个 action 的定义放在函数 `handler` 中。例如:
 若需要在带命名空间的模块注册全局 action,你可添加 `root: true`,并将这个 action 的定义放在函数 `handler` 中。例如:
 
 
@@ -200,7 +200,7 @@ modules: {
 }
 }
 ```
 ```
 
 
-#### 带命名空间的绑定函数
+### 带命名空间的绑定函数
 
 
 当使用 `mapState`, `mapGetters`, `mapActions` 和 `mapMutations` 这些函数来绑定带命名空间的模块时,写起来可能比较繁琐:
 当使用 `mapState`, `mapGetters`, `mapActions` 和 `mapMutations` 这些函数来绑定带命名空间的模块时,写起来可能比较繁琐:
 
 
@@ -261,7 +261,7 @@ export default {
 }
 }
 ```
 ```
 
 
-#### 给插件开发者的注意事项
+### 给插件开发者的注意事项
 
 
 如果你开发的[插件(Plugin)](plugins.md)提供了模块并允许用户将其添加到 Vuex store,可能需要考虑模块的空间名称问题。对于这种情况,你可以通过插件的参数对象来允许用户指定空间名称:
 如果你开发的[插件(Plugin)](plugins.md)提供了模块并允许用户将其添加到 Vuex store,可能需要考虑模块的空间名称问题。对于这种情况,你可以通过插件的参数对象来允许用户指定空间名称:
 
 
@@ -277,7 +277,7 @@ export function createPlugin (options = {}) {
 }
 }
 ```
 ```
 
 
-### 模块动态注册
+## 模块动态注册
 
 
 在 store 创建**之后**,你可以使用 `store.registerModule` 方法注册模块:
 在 store 创建**之后**,你可以使用 `store.registerModule` 方法注册模块:
 
 
@@ -304,13 +304,13 @@ store.registerModule(['nested', 'myModule'], {
 
 
 注意,你可以通过 `store.hasModule(moduleName)` 方法检查该模块是否已经被注册到 store。
 注意,你可以通过 `store.hasModule(moduleName)` 方法检查该模块是否已经被注册到 store。
 
 
-#### 保留 state
+### 保留 state
 
 
 在注册一个新 module 时,你很有可能想保留过去的 state,例如从一个服务端渲染的应用保留 state。你可以通过 `preserveState` 选项将其归档:`store.registerModule('a', module, { preserveState: true })`。
 在注册一个新 module 时,你很有可能想保留过去的 state,例如从一个服务端渲染的应用保留 state。你可以通过 `preserveState` 选项将其归档:`store.registerModule('a', module, { preserveState: true })`。
 
 
 当你设置 `preserveState: true` 时,该模块会被注册,action、mutation 和 getter 会被添加到 store 中,但是 state 不会。这里假设 store 的 state 已经包含了这个 module 的 state 并且你不希望将其覆写。
 当你设置 `preserveState: true` 时,该模块会被注册,action、mutation 和 getter 会被添加到 store 中,但是 state 不会。这里假设 store 的 state 已经包含了这个 module 的 state 并且你不希望将其覆写。
 
 
-### 模块重用
+## 模块重用
 
 
 有时我们可能需要创建一个模块的多个实例,例如:
 有时我们可能需要创建一个模块的多个实例,例如:
 
 

+ 7 - 7
docs/zh/guide/mutations.md

@@ -24,7 +24,7 @@ const store = new Vuex.Store({
 store.commit('increment')
 store.commit('increment')
 ```
 ```
 
 
-### 提交载荷(Payload)
+## 提交载荷(Payload)
 
 
 你可以向 `store.commit` 传入额外的参数,即 mutation 的 **载荷(payload)**:
 你可以向 `store.commit` 传入额外的参数,即 mutation 的 **载荷(payload)**:
 
 
@@ -57,7 +57,7 @@ store.commit('increment', {
 })
 })
 ```
 ```
 
 
-### 对象风格的提交方式
+## 对象风格的提交方式
 
 
 提交 mutation 的另一种方式是直接使用包含 `type` 属性的对象:
 提交 mutation 的另一种方式是直接使用包含 `type` 属性的对象:
 
 
@@ -78,7 +78,7 @@ mutations: {
 }
 }
 ```
 ```
 
 
-### Mutation 需遵守 Vue 的响应规则
+## Mutation 需遵守 Vue 的响应规则
 
 
 既然 Vuex 的 store 中的状态是响应式的,那么当我们变更状态时,监视状态的 Vue 组件也会自动更新。这也意味着 Vuex 中的 mutation 也需要与使用 Vue 一样遵守一些注意事项:
 既然 Vuex 的 store 中的状态是响应式的,那么当我们变更状态时,监视状态的 Vue 组件也会自动更新。这也意味着 Vuex 中的 mutation 也需要与使用 Vue 一样遵守一些注意事项:
 
 
@@ -94,7 +94,7 @@ mutations: {
     state.obj = { ...state.obj, newProp: 123 }
     state.obj = { ...state.obj, newProp: 123 }
     ```
     ```
 
 
-### 使用常量替代 Mutation 事件类型
+## 使用常量替代 Mutation 事件类型
 
 
 使用常量替代 mutation 事件类型在各种 Flux 实现中是很常见的模式。这样可以使 linter 之类的工具发挥作用,同时把这些常量放在单独的文件中可以让你的代码合作者对整个 app 包含的 mutation 一目了然:
 使用常量替代 mutation 事件类型在各种 Flux 实现中是很常见的模式。这样可以使 linter 之类的工具发挥作用,同时把这些常量放在单独的文件中可以让你的代码合作者对整个 app 包含的 mutation 一目了然:
 
 
@@ -121,7 +121,7 @@ const store = new Vuex.Store({
 
 
 用不用常量取决于你——在需要多人协作的大型项目中,这会很有帮助。但如果你不喜欢,你完全可以不这样做。
 用不用常量取决于你——在需要多人协作的大型项目中,这会很有帮助。但如果你不喜欢,你完全可以不这样做。
 
 
-### Mutation 必须是同步函数
+## Mutation 必须是同步函数
 
 
 一条重要的原则就是要记住 **mutation 必须是同步函数**。为什么?请参考下面的例子:
 一条重要的原则就是要记住 **mutation 必须是同步函数**。为什么?请参考下面的例子:
 
 
@@ -137,7 +137,7 @@ mutations: {
 
 
 现在想象,我们正在 debug 一个 app 并且观察 devtool 中的 mutation 日志。每一条 mutation 被记录,devtools 都需要捕捉到前一状态和后一状态的快照。然而,在上面的例子中 mutation 中的异步函数中的回调让这不可能完成:因为当 mutation 触发的时候,回调函数还没有被调用,devtools 不知道什么时候回调函数实际上被调用——实质上任何在回调函数中进行的状态的改变都是不可追踪的。
 现在想象,我们正在 debug 一个 app 并且观察 devtool 中的 mutation 日志。每一条 mutation 被记录,devtools 都需要捕捉到前一状态和后一状态的快照。然而,在上面的例子中 mutation 中的异步函数中的回调让这不可能完成:因为当 mutation 触发的时候,回调函数还没有被调用,devtools 不知道什么时候回调函数实际上被调用——实质上任何在回调函数中进行的状态的改变都是不可追踪的。
 
 
-### 在组件中提交 Mutation
+## 在组件中提交 Mutation
 
 
 你可以在组件中使用 `this.$store.commit('xxx')` 提交 mutation,或者使用 `mapMutations` 辅助函数将组件中的 methods 映射为 `store.commit` 调用(需要在根节点注入 `store`)。
 你可以在组件中使用 `this.$store.commit('xxx')` 提交 mutation,或者使用 `mapMutations` 辅助函数将组件中的 methods 映射为 `store.commit` 调用(需要在根节点注入 `store`)。
 
 
@@ -160,7 +160,7 @@ export default {
 }
 }
 ```
 ```
 
 
-### 下一步:Action
+## 下一步:Action
 
 
 在 mutation 中混合异步调用会导致你的程序很难调试。例如,当你调用了两个包含异步回调的 mutation 来改变状态,你怎么知道什么时候回调和哪个先回调呢?这就是为什么我们要区分这两个概念。在 Vuex 中,**mutation 都是同步事务**:
 在 mutation 中混合异步调用会导致你的程序很难调试。例如,当你调用了两个包含异步回调的 mutation 来改变状态,你怎么知道什么时候回调和哪个先回调呢?这就是为什么我们要区分这两个概念。在 Vuex 中,**mutation 都是同步事务**:
 
 

+ 3 - 3
docs/zh/guide/plugins.md

@@ -23,7 +23,7 @@ const store = new Vuex.Store({
 })
 })
 ```
 ```
 
 
-### 在插件内提交 Mutation
+## 在插件内提交 Mutation
 
 
 在插件中不允许直接修改状态——类似于组件,只能通过提交 mutation 来触发变化。
 在插件中不允许直接修改状态——类似于组件,只能通过提交 mutation 来触发变化。
 
 
@@ -54,7 +54,7 @@ const store = new Vuex.Store({
 })
 })
 ```
 ```
 
 
-### 生成 State 快照
+## 生成 State 快照
 
 
 有时候插件需要获得状态的“快照”,比较改变的前后状态。想要实现这项功能,你需要对状态对象进行深拷贝:
 有时候插件需要获得状态的“快照”,比较改变的前后状态。想要实现这项功能,你需要对状态对象进行深拷贝:
 
 
@@ -85,7 +85,7 @@ const store = new Vuex.Store({
 
 
 上面插件会默认启用。在发布阶段,你需要使用 webpack 的 [DefinePlugin](https://webpack.js.org/plugins/define-plugin/) 或者是 Browserify 的 [envify](https://github.com/hughsk/envify) 使 `process.env.NODE_ENV !== 'production'` 为 `false`。
 上面插件会默认启用。在发布阶段,你需要使用 webpack 的 [DefinePlugin](https://webpack.js.org/plugins/define-plugin/) 或者是 Browserify 的 [envify](https://github.com/hughsk/envify) 使 `process.env.NODE_ENV !== 'production'` 为 `false`。
 
 
-### 内置 Logger 插件
+## 内置 Logger 插件
 
 
 > 如果正在使用 [vue-devtools](https://github.com/vuejs/vue-devtools),你可能不需要此插件。
 > 如果正在使用 [vue-devtools](https://github.com/vuejs/vue-devtools),你可能不需要此插件。
 
 

+ 5 - 5
docs/zh/guide/state.md

@@ -1,6 +1,6 @@
 # State
 # State
 
 
-### 单一状态树
+## 单一状态树
 
 
 <div class="scrimba"><a href="https://scrimba.com/p/pnyzgAP/cWw3Zhb" target="_blank" rel="noopener noreferrer">在 Scrimba 上尝试这节课</a></div>
 <div class="scrimba"><a href="https://scrimba.com/p/pnyzgAP/cWw3Zhb" target="_blank" rel="noopener noreferrer">在 Scrimba 上尝试这节课</a></div>
 
 
@@ -10,7 +10,7 @@ Vuex 使用**单一状态树**——是的,用一个对象就包含了全部
 
 
 存储在 Vuex 中的数据和 Vue 实例中的 `data` 遵循相同的规则,例如状态对象必须是纯粹 (plain) 的。**参考:**[Vue#data](https://cn.vuejs.org/v2/api/#data)。
 存储在 Vuex 中的数据和 Vue 实例中的 `data` 遵循相同的规则,例如状态对象必须是纯粹 (plain) 的。**参考:**[Vue#data](https://cn.vuejs.org/v2/api/#data)。
 
 
-### 在 Vue 组件中获得 Vuex 状态
+## 在 Vue 组件中获得 Vuex 状态
 
 
 那么我们如何在 Vue 组件中展示状态呢?由于 Vuex 的状态存储是响应式的,从 store 实例中读取状态最简单的方法就是在[计算属性](https://cn.vuejs.org/guide/computed.html)中返回某个状态:
 那么我们如何在 Vue 组件中展示状态呢?由于 Vuex 的状态存储是响应式的,从 store 实例中读取状态最简单的方法就是在[计算属性](https://cn.vuejs.org/guide/computed.html)中返回某个状态:
 
 
@@ -59,7 +59,7 @@ const Counter = {
 }
 }
 ```
 ```
 
 
-### `mapState` 辅助函数
+## `mapState` 辅助函数
 
 
 <div class="scrimba"><a href="https://scrimba.com/p/pnyzgAP/c8Pz7BSK" target="_blank" rel="noopener noreferrer">在 Scrimba 上尝试这节课</a></div>
 <div class="scrimba"><a href="https://scrimba.com/p/pnyzgAP/c8Pz7BSK" target="_blank" rel="noopener noreferrer">在 Scrimba 上尝试这节课</a></div>
 
 
@@ -95,7 +95,7 @@ computed: mapState([
 ])
 ])
 ```
 ```
 
 
-### 对象展开运算符
+## 对象展开运算符
 
 
 `mapState` 函数返回的是一个对象。我们如何将它与局部计算属性混合使用呢?通常,我们需要使用一个工具函数将多个对象合并为一个,以使我们可以将最终对象传给 `computed` 属性。但是自从有了[对象展开运算符](https://github.com/tc39/proposal-object-rest-spread),我们可以极大地简化写法:
 `mapState` 函数返回的是一个对象。我们如何将它与局部计算属性混合使用呢?通常,我们需要使用一个工具函数将多个对象合并为一个,以使我们可以将最终对象传给 `computed` 属性。但是自从有了[对象展开运算符](https://github.com/tc39/proposal-object-rest-spread),我们可以极大地简化写法:
 
 
@@ -109,6 +109,6 @@ computed: {
 }
 }
 ```
 ```
 
 
-### 组件仍然保有局部状态
+## 组件仍然保有局部状态
 
 
 使用 Vuex 并不意味着你需要将**所有的**状态放入 Vuex。虽然将所有的状态放到 Vuex 会使状态变化更显式和易调试,但也会使代码变得冗长和不直观。如果有些状态严格属于单个组件,最好还是作为组件的局部状态。你应该根据你的应用开发需要进行权衡和确定。
 使用 Vuex 并不意味着你需要将**所有的**状态放入 Vuex。虽然将所有的状态放到 Vuex 会使状态变化更显式和易调试,但也会使代码变得冗长和不直观。如果有些状态严格属于单个组件,最好还是作为组件的局部状态。你应该根据你的应用开发需要进行权衡和确定。

+ 1 - 1
docs/zh/guide/strict.md

@@ -11,7 +11,7 @@ const store = new Vuex.Store({
 
 
 在严格模式下,无论何时发生了状态变更且不是由 mutation 函数引起的,将会抛出错误。这能保证所有的状态变更都能被调试工具跟踪到。
 在严格模式下,无论何时发生了状态变更且不是由 mutation 函数引起的,将会抛出错误。这能保证所有的状态变更都能被调试工具跟踪到。
 
 
-### 开发环境与发布环境
+## 开发环境与发布环境
 
 
 **不要在发布环境下启用严格模式**!严格模式会深度监测状态树来检测不合规的状态变更——请确保在发布环境下关闭严格模式,以避免性能损失。
 **不要在发布环境下启用严格模式**!严格模式会深度监测状态树来检测不合规的状态变更——请确保在发布环境下关闭严格模式,以避免性能损失。
 
 

+ 7 - 7
docs/zh/guide/testing.md

@@ -4,7 +4,7 @@
 
 
 我们主要想针对 Vuex 中的 mutation 和 action 进行单元测试。
 我们主要想针对 Vuex 中的 mutation 和 action 进行单元测试。
 
 
-### 测试 Mutation
+## 测试 Mutation
 
 
 Mutation 很容易被测试,因为它们仅仅是一些完全依赖参数的函数。这里有一个小技巧,如果你在 `store.js` 文件中定义了 mutation,并且使用 ES2015 模块功能默认输出了 Vuex.Store 的实例,那么你仍然可以给 mutation 取个变量名然后把它输出去:
 Mutation 很容易被测试,因为它们仅仅是一些完全依赖参数的函数。这里有一个小技巧,如果你在 `store.js` 文件中定义了 mutation,并且使用 ES2015 模块功能默认输出了 Vuex.Store 的实例,那么你仍然可以给 mutation 取个变量名然后把它输出去:
 
 
@@ -49,7 +49,7 @@ describe('mutations', () => {
 })
 })
 ```
 ```
 
 
-### 测试 Action
+## 测试 Action
 
 
 Action 应对起来略微棘手,因为它们可能需要调用外部的 API。当测试 action 的时候,我们需要增加一个 mocking 服务层——例如,我们可以把 API 调用抽象成服务,然后在测试文件中用 mock 服务回应 API 调用。为了便于解决 mock 依赖,可以用 webpack 和 [inject-loader](https://github.com/plasticine/inject-loader) 打包测试文件。
 Action 应对起来略微棘手,因为它们可能需要调用外部的 API。当测试 action 的时候,我们需要增加一个 mocking 服务层——例如,我们可以把 API 调用抽象成服务,然后在测试文件中用 mock 服务回应 API 调用。为了便于解决 mock 依赖,可以用 webpack 和 [inject-loader](https://github.com/plasticine/inject-loader) 打包测试文件。
 
 
@@ -145,7 +145,7 @@ describe('actions', () => {
 })
 })
 ```
 ```
 
 
-### 测试 Getter
+## 测试 Getter
 
 
 如果你的 getter 包含很复杂的计算过程,很有必要测试它们。Getter 的测试与 mutation 一样直截了当。
 如果你的 getter 包含很复杂的计算过程,很有必要测试它们。Getter 的测试与 mutation 一样直截了当。
 
 
@@ -192,11 +192,11 @@ describe('getters', () => {
 })
 })
 ```
 ```
 
 
-### 执行测试
+## 执行测试
 
 
 如果你的 mutation 和 action 编写正确,经过合理地 mocking 处理之后这些测试应该不依赖任何浏览器 API,因此你可以直接用 webpack 打包这些测试文件然后在 Node 中执行。换种方式,你也可以用 `mocha-loader` 或 Karma + `karma-webpack`在真实浏览器环境中进行测试。
 如果你的 mutation 和 action 编写正确,经过合理地 mocking 处理之后这些测试应该不依赖任何浏览器 API,因此你可以直接用 webpack 打包这些测试文件然后在 Node 中执行。换种方式,你也可以用 `mocha-loader` 或 Karma + `karma-webpack`在真实浏览器环境中进行测试。
 
 
-#### 在 Node 中执行测试
+### 在 Node 中执行测试
 
 
 创建以下 webpack 配置(配置好 [`.babelrc`](https://babeljs.io/docs/usage/babelrc/)):
 创建以下 webpack 配置(配置好 [`.babelrc`](https://babeljs.io/docs/usage/babelrc/)):
 
 
@@ -227,13 +227,13 @@ webpack
 mocha test-bundle.js
 mocha test-bundle.js
 ```
 ```
 
 
-#### 在浏览器中测试
+### 在浏览器中测试
 
 
 1. 安装 `mocha-loader`。
 1. 安装 `mocha-loader`。
 2. 把上述 webpack 配置中的 `entry` 改成 `'mocha-loader!babel-loader!./test.js'`。
 2. 把上述 webpack 配置中的 `entry` 改成 `'mocha-loader!babel-loader!./test.js'`。
 3. 用以上配置启动 `webpack-dev-server`。
 3. 用以上配置启动 `webpack-dev-server`。
 4. 访问 `localhost:8080/webpack-dev-server/test-bundle`。
 4. 访问 `localhost:8080/webpack-dev-server/test-bundle`。
 
 
-#### 使用 Karma + karma-webpack 在浏览器中执行测试
+### 使用 Karma + karma-webpack 在浏览器中执行测试
 
 
 详见 [vue-loader documentation](https://vuejs.github.io/vue-loader/workflow/testing.html)。
 详见 [vue-loader documentation](https://vuejs.github.io/vue-loader/workflow/testing.html)。

+ 5 - 5
docs/zh/installation.md

@@ -1,6 +1,6 @@
 # 安装
 # 安装
 
 
-### 直接下载 / CDN 引用
+## 直接下载 / CDN 引用
 
 
 [https://unpkg.com/vuex](https://unpkg.com/vuex)
 [https://unpkg.com/vuex](https://unpkg.com/vuex)
 
 
@@ -15,13 +15,13 @@
 <script src="/path/to/vuex.js"></script>
 <script src="/path/to/vuex.js"></script>
 ```
 ```
 
 
-### NPM
+## NPM
 
 
 ``` bash
 ``` bash
 npm install vuex --save
 npm install vuex --save
 ```
 ```
 
 
-### Yarn
+## Yarn
 
 
 ``` bash
 ``` bash
 yarn add vuex
 yarn add vuex
@@ -38,7 +38,7 @@ Vue.use(Vuex)
 
 
 当使用全局 script 标签引用 Vuex 时,不需要以上安装过程。
 当使用全局 script 标签引用 Vuex 时,不需要以上安装过程。
 
 
-### Promise
+## Promise
 
 
 Vuex 依赖 [Promise](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Using_promises)。如果你支持的浏览器并没有实现 Promise (比如 IE),那么你可以使用一个 polyfill 的库,例如 [es6-promise](https://github.com/stefanpenner/es6-promise)。
 Vuex 依赖 [Promise](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Using_promises)。如果你支持的浏览器并没有实现 Promise (比如 IE),那么你可以使用一个 polyfill 的库,例如 [es6-promise](https://github.com/stefanpenner/es6-promise)。
 
 
@@ -63,7 +63,7 @@ yarn add es6-promise # Yarn
 import 'es6-promise/auto'
 import 'es6-promise/auto'
 ```
 ```
 
 
-### 自己构建
+## 自己构建
 
 
 如果需要使用 dev 分支下的最新版本,您可以直接从 GitHub 上克隆代码并自己构建。
 如果需要使用 dev 分支下的最新版本,您可以直接从 GitHub 上克隆代码并自己构建。