Vuex中模块state为何通过store.state.模块名访问而非store.模块名.state？

这是Vuex官方的刻意设计，核心原因有3个：

• 保证状态访问路径统一
  Vuex本身是单一状态树设计，整个应用的所有状态都会聚合到根state对象下，不管是根级直接定义的状态，还是模块内的状态，统一从store.state入口访问：
  比如根store直接定义的count状态用store.state.count获取，模块a里的count状态就用store.state.a.count获取，不用额外区分状态所属层级，记忆成本更低。
• 避免store实例的命名冲突
  store实例本身已经内置了dispatch、commit、getters等属性和方法，如果把模块直接挂载到store实例根属性下，一旦模块名和内置属性重名（比如给模块起名叫dispatch），就会直接覆盖内置属性，导致功能异常。把所有模块状态收拢到state属性下就能完全规避这个问题。
• 和内部状态处理逻辑匹配
  你传入的原始模块对象不会直接挂载到store实例上，Vuex注册模块时会做结构转换：把模块的state返回值提取出来，作为子节点挂载到根state下，模块的mutations、actions等逻辑会被注册到内部调度器，不会暴露到store实例根级，自然也就不存在store.a这个对应原始模块对象的属性。

你觉得store.a.state逻辑更顺，其实是把你定义的模块配置对象的结构，和Vuex处理后的运行时store结构混在一起了，二者本身就不是完全对应的关系。

你给出的示例代码对应的运行时结构简化后是这样的：

const store = {
  // 所有状态都收拢到state下
  state: {
    // 根级状态
    xxx: 'xxx',
    // 模块a的状态
    a: { /* moduleA的state返回值 */ },
    // 模块b的状态
    b: { /* moduleB的state返回值 */ }
  },
  // 内置方法
  dispatch: () => {},
  commit: () => {},
  // 其他内部属性...
}

内容的提问来源于stack exchange，提问作者tlietz