{"action":"created","comment":{"url":"https://api.github.com/repos/vuejs/vuex/pulls/comments/70372077","id":70372077,"diff_hunk":"@@ -20,114 +21,112 @@ Vuex のアクションとミューテーションの良いところは、**そ\n ├── components\n │   ├── App.vue\n │   └── ...\n-└── store\n-    ├── index.js     # vuex store をエクスポート\n-    ├── actions.js   # 全てのアクションをエクスポート\n-    └── mutations.js # 全てのミューテーションをエクスポート\n+└── vuex\n+    ├── store.js     # ストア (初期状態とミューテーションを含む) を公開\n+    └── actions.js   # 全てのアクションを公開\n ```\n \n-実際の例として、[TodoMVC example](https://github.com/vuejs/vuex/tree/master/examples/todomvc) を確認してください。\n+実際の例として、 [Counter example](https://github.com/vuejs/vuex/tree/master/examples/counter) や [TodoMVC example](https://github.com/vuejs/vuex/tree/master/examples/todomvc) を確認してください。\n \n-### 中〜大規模プロジェクト\n+あるいは、ミューテーションだけをそれ自身のファイルに分割することができます。\n \n-任意の素晴らしいアプリケーションに対して、多分、Vuex 関連のコードをさらに私たちのアプリケーションを特定のドメインによって各お気に入りの複数\"モジュール\" (雑にいうと、純粋な Flux で \"stores\" にほぼ匹敵)に分離したいです。各サブモジュールはステートのサブツリーを管理することになり、そのサブツリーとそのサブツリーで操作する全てのミューテーションに対する初期ステートをエクスポートします:\n+### 中規模から大規模なプロジェクト\n \n-``` bash\n+それなりに手の込んだアプリケーションであれば、おそらくさらに複数の Vuex 関連のコードをそれぞれがアプリの特定のドメインを担う複数の\"モジュール\"に分割したくなります(ざっくりと比べれば、普通の Flux の\" stores \"、 Redux の \" reducers \" に相当します)。各モジュールは、状態のサブツリーを管理し、サブツリーの初期状態とサブツリーで動作する全ての変更を公開します。\n+\n+```bash\n ├── index.html\n ├── main.js\n ├── api\n-│   └── ... # API リクエストを作成するために抽象化\n+│   └── ... # APIリクエストを作成するための抽象化\n ├── components\n │   ├── App.vue\n │   └── ...\n-└── store\n-    ├── actions.js # 全てのアクションをエクスポート\n-    ├── index.js\n-    ├── modules\n-    │   ├── cart.js       # ステートとカート向けのミューテーション\n-    │   └── products.js   # ステートと製品向けのミューテーション\n-    └── mutation-types.js # 定数\n+└── vuex\n+    ├── actions.js        # 全てのアクションのエクスポート\n+    ├── store.js          # モジュールを集め、ストアを公開する\n+    ├── mutation-types.js # 定数\n+    └── modules\n+        ├── cart.js       # カートのための状態とミューテーション\n+        └── products.js   # 商品のための状態とミューテーション\n ```\n \n 典型的なモジュールは次のようになります:\n \n ``` js\n // vuex/modules/products.js\n-import { RECEIVE_PRODUCTS, ADD_TO_CART } from '../mutation-types'\n-\n-// 初期ステート\n-export const productsInitialState = []\n+import {\n+  RECEIVE_PRODUCTS,\n+  ADD_TO_CART\n+} from '../mutation-types'\n+\n+// 初期状態\n+const state = {\n+  all: []\n+}\n \n // ミューテーション\n-export const productsMutations = {\n+const mutations = {\n   [RECEIVE_PRODUCTS] (state, products) {\n-    state.products = products\n+    state.all = products\n   },\n \n-  [ADD_TO_CART] ({ products }, productId) {\n-    const product = products.find(p => p.id === productId)\n-    if (product.inventory > 0) {\n-      product.inventory--\n-    }\n+  [ADD_TO_CART] (state, productId) {\n+    state.all.find(p => p.id === productId).inventory--\n   }\n }\n+\n+export default {\n+  state,\n+  mutations\n+}\n ```\n \n-そして `store/index.js` では、Vuex インスタンスを作成するために複数のモジュールをいっしょに\"組み立てます(assemble)\":\n+そして、`vuex/store.js` では、 Vuex インスタンスを生成するために複数のモジュールをひとつに集めて整理します( \"assemble\" ):\n \n-``` js\n+```js\n+// vuex/store.js\n import Vue from 'vue'\n import Vuex from '../../../src'\n-import * as actions from './actions'\n-// modules からパーツをインポート\n-import { cartInitialState, cartMutations } from './modules/cart'\n-import { productsInitialState, productsMutations } from './modules/products'\n+// それぞれのモジュールをインポートする\n+import cart from './modules/cart'\n+import products from './modules/products'\n \n Vue.use(Vuex)\n \n export default new Vuex.Store({\n-  // ...\n-  // root なステートにサブツリーを結合\n-  state: {\n-    cart: cartInitialState,\n-    products: productsInitialState\n-  },\n-  // ミューテーションは複数の modules から\n-  // ミューテーション定義オブジェクトの配列にすることが可能\n-  mutations: [cartMutations, productsMutations]\n+  // combine sub modules\n+  modules: {\n+    cart,\n+    products\n+  }\n })\n ```\n \n-全てのモジュールは単純にオブジェクトと関数をエクスポートするため、テストとメンテナンスすることが非常に簡単です。また、あなたの好みに合った構造を見つけるためにここで使用されるパターンを変えることは自由です。\n+ここで、 `cart` モジュールの初期状態は、ルートステートツリーの `store.state.cart` としてアタッチされます。加えて、全てのサブモジュールで定義されたミューテーションは、それに関係したサブステートツリーを受け取ります。なので、`cart` モジュールで定義されたミューテーションは、`store.state.cart` を第一引数として受け取ることになります。\n \n-単一のアクションは、複数のモジュールに影響を与えるミューテーションをディスパッチする可能性があるため、モジュールにアクションを置いていないことに注意してください。また、ステートの形式と、より良い関心事の分離のためにミューテーションの実装詳細からアクションを分離するもの良いアイデアです。アクションファイルが大きくなりすぎた場合は、フォルダにそれを格納し、個々のファイルへ長い非同期アクションの実装を分割できます。\n-\n-実際の例として、[Shopping Cart Example](https://github.com/vuejs/vuex/tree/master/examples/shopping-cart) を確認してください。\n-\n-### 共有された算出プロパティ Getter の抽出\n-\n-大規模なプロジェクトでは、複数のコンポーネントが Vuex のステートに基づいて同じ算出プロパティ (computed property) を必要とする可能性があります。算出プロパティは単に関数であるため、それらが任意のコンポーネントで共有することができるように、ファイルにそれらを分割することができます:\n+サブステートツリーのルートは、モジュール内部で自身を取りかえることはできません。例えば、次のコードは動作しません:\n \n ``` js\n-// getters.js\n-import store from './store'\n-\n-export function filteredTodos () {\n-  return store.state.messages.filter(message => {\n-    return message.threadID === store.state.currentThreadID\n-  })\n+const mutations = {\n+  SOME_MUTATION (state) {\n+    state = { ... }\n+  }\n }\n ```\n \n-``` js\n-// コンポーネントで...\n-import { filteredTodos } from './getters'\n+代わりに、常にサブツリーのルートののプロパティとして、実際の状態を保存します。","path":"docs/ja/structure.md","position":185,"original_position":185,"commit_id":"1590e3a6004a1b1c7b550bd8d9f6dfe880c080f0","original_commit_id":"1590e3a6004a1b1c7b550bd8d9f6dfe880c080f0","user":{"login":"ktsn","id":2194624,"avatar_url":"https://avatars.githubusercontent.com/u/2194624?v=3","gravatar_id":"","url":"https://api.github.com/users/ktsn","html_url":"https://github.com/ktsn","followers_url":"https://api.github.com/users/ktsn/followers","following_url":"https://api.github.com/users/ktsn/following{/other_user}","gists_url":"https://api.github.com/users/ktsn/gists{/gist_id}","starred_url":"https://api.github.com/users/ktsn/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ktsn/subscriptions","organizations_url":"https://api.github.com/users/ktsn/orgs","repos_url":"https://api.github.com/users/ktsn/repos","events_url":"https://api.github.com/users/ktsn/events{/privacy}","received_events_url":"https://api.github.com/users/ktsn/received_events","type":"User","site_admin":false},"body":"「のの」になってます。","created_at":"2016-07-12T03:21:45Z","updated_at":"2016-07-12T03:21:45Z","html_url":"https://github.com/vuejs/vuex/pull/240#discussion_r70372077","pull_request_url":"https://api.github.com/repos/vuejs/vuex/pulls/240","_links":{"self":{"href":"https://api.github.com/repos/vuejs/vuex/pulls/comments/70372077"},"html":{"href":"https://github.com/vuejs/vuex/pull/240#discussion_r70372077"},"pull_request":{"href":"https://api.github.com/repos/vuejs/vuex/pulls/240"}}},"pull_request":{"url":"https://api.github.com/repos/vuejs/vuex/pulls/240","id":76364510,"html_url":"https://github.com/vuejs/vuex/pull/240","diff_url":"https://github.com/vuejs/vuex/pull/240.diff","patch_url":"https://github.com/vuejs/vuex/pull/240.patch","issue_url":"https://api.github.com/repos/vuejs/vuex/issues/240","number":240,"state":"open","locked":false,"title":"[WIP] Update ja document","user":{"login":"kitak","id":228410,"avatar_url":"https://avatars.githubusercontent.com/u/228410?v=3","gravatar_id":"","url":"https://api.github.com/users/kitak","html_url":"https://github.com/kitak","followers_url":"https://api.github.com/users/kitak/followers","following_url":"https://api.github.com/users/kitak/following{/other_user}","gists_url":"https://api.github.com/users/kitak/gists{/gist_id}","starred_url":"https://api.github.com/users/kitak/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/kitak/subscriptions","organizations_url":"https://api.github.com/users/kitak/orgs","repos_url":"https://api.github.com/users/kitak/repos","events_url":"https://api.github.com/users/kitak/events{/privacy}","received_events_url":"https://api.github.com/users/kitak/received_events","type":"User","site_admin":false},"body":"**This pull request is working in progress.**\r\n\r\n### TODO\r\n- [x] What is Vuex?(intro.md) @kitak\r\n- [x] Getting Started(getting-started.md) @kitak\r\n- [x] Tutorial(tutorial.md) @ktsn \r\n- Core Concepts\r\n  - [x] State and Getters(state.md) @kitak\r\n  - [x] Mutations(mutations.md) @kitak\r\n  - [x] Actions(actions.md) @ktsn \r\n- [x] Data Flow(data-flow.md) @ktsn \r\n- [x] Application Structure(structure.md) @kitak\r\n- [ ] Plugins(plugins.md) @kitak\r\n- [ ] Strict Mode(strict.md)\r\n- [ ] Form Handling(forms.md)\r\n- [ ] Testing(testing.md)\r\n- [ ] Hot Reloading(hot-reload.md)\r\n- [ ] API Reference(api.md)","created_at":"2016-07-06T00:49:11Z","updated_at":"2016-07-12T03:21:45Z","closed_at":null,"merged_at":null,"merge_commit_sha":"97260da18cac7aefc946c71213700138f765c275","assignee":null,"assignees":[],"milestone":null,"commits_url":"https://api.github.com/repos/vuejs/vuex/pulls/240/commits","review_comments_url":"https://api.github.com/repos/vuejs/vuex/pulls/240/comments","review_comment_url":"https://api.github.com/repos/vuejs/vuex/pulls/comments{/number}","comments_url":"https://api.github.com/repos/vuejs/vuex/issues/240/comments","statuses_url":"https://api.github.com/repos/vuejs/vuex/statuses/1590e3a6004a1b1c7b550bd8d9f6dfe880c080f0","head":{"label":"kitak:update-jp-doc","ref":"update-jp-doc","sha":"1590e3a6004a1b1c7b550bd8d9f6dfe880c080f0","user":{"login":"kitak","id":228410,"avatar_url":"https://avatars.githubusercontent.com/u/228410?v=3","gravatar_id":"","url":"https://api.github.com/users/kitak","html_url":"https://github.com/kitak","followers_url":"https://api.github.com/users/kitak/followers","following_url":"https://api.github.com/users/kitak/following{/other_user}","gists_url":"https://api.github.com/users/kitak/gists{/gist_id}","starred_url":"https://api.github.com/users/kitak/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/kitak/subscriptions","organizations_url":"https://api.github.com/users/kitak/orgs","repos_url":"https://api.github.com/users/kitak/repos","events_url":"https://api.github.com/users/kitak/events{/privacy}","received_events_url":"https://api.github.com/users/kitak/received_events","type":"User","site_admin":false},"repo":{"id":53993856,"name":"vuex","full_name":"kitak/vuex","owner":{"login":"kitak","id":228410,"avatar_url":"https://avatars.githubusercontent.com/u/228410?v=3","gravatar_id":"","url":"https://api.github.com/users/kitak","html_url":"https://github.com/kitak","followers_url":"https://api.github.com/users/kitak/followers","following_url":"https://api.github.com/users/kitak/following{/other_user}","gists_url":"https://api.github.com/users/kitak/gists{/gist_id}","starred_url":"https://api.github.com/users/kitak/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/kitak/subscriptions","organizations_url":"https://api.github.com/users/kitak/orgs","repos_url":"https://api.github.com/users/kitak/repos","events_url":"https://api.github.com/users/kitak/events{/privacy}","received_events_url":"https://api.github.com/users/kitak/received_events","type":"User","site_admin":false},"private":false,"html_url":"https://github.com/kitak/vuex","description":"Flux-inspired Application Architecture for Vue.js.","fork":true,"url":"https://api.github.com/repos/kitak/vuex","forks_url":"https://api.github.com/repos/kitak/vuex/forks","keys_url":"https://api.github.com/repos/kitak/vuex/keys{/key_id}","collaborators_url":"https://api.github.com/repos/kitak/vuex/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/kitak/vuex/teams","hooks_url":"https://api.github.com/repos/kitak/vuex/hooks","issue_events_url":"https://api.github.com/repos/kitak/vuex/issues/events{/number}","events_url":"https://api.github.com/repos/kitak/vuex/events","assignees_url":"https://api.github.com/repos/kitak/vuex/assignees{/user}","branches_url":"https://api.github.com/repos/kitak/vuex/branches{/branch}","tags_url":"https://api.github.com/repos/kitak/vuex/tags","blobs_url":"https://api.github.com/repos/kitak/vuex/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/kitak/vuex/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/kitak/vuex/git/refs{/sha}","trees_url":"https://api.github.com/repos/kitak/vuex/git/trees{/sha}","statuses_url":"https://api.github.com/repos/kitak/vuex/statuses/{sha}","languages_url":"https://api.github.com/repos/kitak/vuex/languages","stargazers_url":"https://api.github.com/repos/kitak/vuex/stargazers","contributors_url":"https://api.github.com/repos/kitak/vuex/contributors","subscribers_url":"https://api.github.com/repos/kitak/vuex/subscribers","subscription_url":"https://api.github.com/repos/kitak/vuex/subscription","commits_url":"https://api.github.com/repos/kitak/vuex/commits{/sha}","git_commits_url":"https://api.github.com/repos/kitak/vuex/git/commits{/sha}","comments_url":"https://api.github.com/repos/kitak/vuex/comments{/number}","issue_comment_url":"https://api.github.com/repos/kitak/vuex/issues/comments{/number}","contents_url":"https://api.github.com/repos/kitak/vuex/contents/{+path}","compare_url":"https://api.github.com/repos/kitak/vuex/compare/{base}...{head}","merges_url":"https://api.github.com/repos/kitak/vuex/merges","archive_url":"https://api.github.com/repos/kitak/vuex/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/kitak/vuex/downloads","issues_url":"https://api.github.com/repos/kitak/vuex/issues{/number}","pulls_url":"https://api.github.com/repos/kitak/vuex/pulls{/number}","milestones_url":"https://api.github.com/repos/kitak/vuex/milestones{/number}","notifications_url":"https://api.github.com/repos/kitak/vuex/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/kitak/vuex/labels{/name}","releases_url":"https://api.github.com/repos/kitak/vuex/releases{/id}","deployments_url":"https://api.github.com/repos/kitak/vuex/deployments","created_at":"2016-03-16T02:17:59Z","updated_at":"2016-03-16T02:18:00Z","pushed_at":"2016-07-11T11:54:57Z","git_url":"git://github.com/kitak/vuex.git","ssh_url":"git@github.com:kitak/vuex.git","clone_url":"https://github.com/kitak/vuex.git","svn_url":"https://github.com/kitak/vuex","homepage":"","size":7253,"stargazers_count":0,"watchers_count":0,"language":"JavaScript","has_issues":false,"has_downloads":true,"has_wiki":false,"has_pages":false,"forks_count":0,"mirror_url":null,"open_issues_count":0,"forks":0,"open_issues":0,"watchers":0,"default_branch":"master"}},"base":{"label":"vuejs:master","ref":"master","sha":"0841d750002246ededa0e60d9edc1cf6b02d2244","user":{"login":"vuejs","id":6128107,"avatar_url":"https://avatars.githubusercontent.com/u/6128107?v=3","gravatar_id":"","url":"https://api.github.com/users/vuejs","html_url":"https://github.com/vuejs","followers_url":"https://api.github.com/users/vuejs/followers","following_url":"https://api.github.com/users/vuejs/following{/other_user}","gists_url":"https://api.github.com/users/vuejs/gists{/gist_id}","starred_url":"https://api.github.com/users/vuejs/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/vuejs/subscriptions","organizations_url":"https://api.github.com/users/vuejs/orgs","repos_url":"https://api.github.com/users/vuejs/repos","events_url":"https://api.github.com/users/vuejs/events{/privacy}","received_events_url":"https://api.github.com/users/vuejs/received_events","type":"Organization","site_admin":false},"repo":{"id":39176269,"name":"vuex","full_name":"vuejs/vuex","owner":{"login":"vuejs","id":6128107,"avatar_url":"https://avatars.githubusercontent.com/u/6128107?v=3","gravatar_id":"","url":"https://api.github.com/users/vuejs","html_url":"https://github.com/vuejs","followers_url":"https://api.github.com/users/vuejs/followers","following_url":"https://api.github.com/users/vuejs/following{/other_user}","gists_url":"https://api.github.com/users/vuejs/gists{/gist_id}","starred_url":"https://api.github.com/users/vuejs/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/vuejs/subscriptions","organizations_url":"https://api.github.com/users/vuejs/orgs","repos_url":"https://api.github.com/users/vuejs/repos","events_url":"https://api.github.com/users/vuejs/events{/privacy}","received_events_url":"https://api.github.com/users/vuejs/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/vuejs/vuex","description":"Flux-inspired Application Architecture for Vue.js.","fork":false,"url":"https://api.github.com/repos/vuejs/vuex","forks_url":"https://api.github.com/repos/vuejs/vuex/forks","keys_url":"https://api.github.com/repos/vuejs/vuex/keys{/key_id}","collaborators_url":"https://api.github.com/repos/vuejs/vuex/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/vuejs/vuex/teams","hooks_url":"https://api.github.com/repos/vuejs/vuex/hooks","issue_events_url":"https://api.github.com/repos/vuejs/vuex/issues/events{/number}","events_url":"https://api.github.com/repos/vuejs/vuex/events","assignees_url":"https://api.github.com/repos/vuejs/vuex/assignees{/user}","branches_url":"https://api.github.com/repos/vuejs/vuex/branches{/branch}","tags_url":"https://api.github.com/repos/vuejs/vuex/tags","blobs_url":"https://api.github.com/repos/vuejs/vuex/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/vuejs/vuex/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/vuejs/vuex/git/refs{/sha}","trees_url":"https://api.github.com/repos/vuejs/vuex/git/trees{/sha}","statuses_url":"https://api.github.com/repos/vuejs/vuex/statuses/{sha}","languages_url":"https://api.github.com/repos/vuejs/vuex/languages","stargazers_url":"https://api.github.com/repos/vuejs/vuex/stargazers","contributors_url":"https://api.github.com/repos/vuejs/vuex/contributors","subscribers_url":"https://api.github.com/repos/vuejs/vuex/subscribers","subscription_url":"https://api.github.com/repos/vuejs/vuex/subscription","commits_url":"https://api.github.com/repos/vuejs/vuex/commits{/sha}","git_commits_url":"https://api.github.com/repos/vuejs/vuex/git/commits{/sha}","comments_url":"https://api.github.com/repos/vuejs/vuex/comments{/number}","issue_comment_url":"https://api.github.com/repos/vuejs/vuex/issues/comments{/number}","contents_url":"https://api.github.com/repos/vuejs/vuex/contents/{+path}","compare_url":"https://api.github.com/repos/vuejs/vuex/compare/{base}...{head}","merges_url":"https://api.github.com/repos/vuejs/vuex/merges","archive_url":"https://api.github.com/repos/vuejs/vuex/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/vuejs/vuex/downloads","issues_url":"https://api.github.com/repos/vuejs/vuex/issues{/number}","pulls_url":"https://api.github.com/repos/vuejs/vuex/pulls{/number}","milestones_url":"https://api.github.com/repos/vuejs/vuex/milestones{/number}","notifications_url":"https://api.github.com/repos/vuejs/vuex/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/vuejs/vuex/labels{/name}","releases_url":"https://api.github.com/repos/vuejs/vuex/releases{/id}","deployments_url":"https://api.github.com/repos/vuejs/vuex/deployments","created_at":"2015-07-16T04:21:26Z","updated_at":"2016-07-12T02:29:27Z","pushed_at":"2016-07-11T20:58:39Z","git_url":"git://github.com/vuejs/vuex.git","ssh_url":"git@github.com:vuejs/vuex.git","clone_url":"https://github.com/vuejs/vuex.git","svn_url":"https://github.com/vuejs/vuex","homepage":"","size":9001,"stargazers_count":2027,"watchers_count":2027,"language":"JavaScript","has_issues":true,"has_downloads":true,"has_wiki":false,"has_pages":true,"forks_count":265,"mirror_url":null,"open_issues_count":9,"forks":265,"open_issues":9,"watchers":2027,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/vuejs/vuex/pulls/240"},"html":{"href":"https://github.com/vuejs/vuex/pull/240"},"issue":{"href":"https://api.github.com/repos/vuejs/vuex/issues/240"},"comments":{"href":"https://api.github.com/repos/vuejs/vuex/issues/240/comments"},"review_comments":{"href":"https://api.github.com/repos/vuejs/vuex/pulls/240/comments"},"review_comment":{"href":"https://api.github.com/repos/vuejs/vuex/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/vuejs/vuex/pulls/240/commits"},"statuses":{"href":"https://api.github.com/repos/vuejs/vuex/statuses/1590e3a6004a1b1c7b550bd8d9f6dfe880c080f0"}}}}
{"actor":{"display_login":"ktsn"}}