Vue.js 为什么状态对组件可见？

据我所知，vuex的目的是保证状态的一致性，只通过突变/操作/获取程序将状态暴露给组件

但是，组件可以直接操作$store.state，而不使用突变/操作，这可能会导致状态不一致

---

为什么vuex状态会直接暴露？

使用突变/操作/获取程序等是建议的最佳实践，但并不意味着必须遵循

可能只是想从状态中读取一个值，此时为其编写getter可能有点过分

我个人总是尝试使用行动/获取者来保持事情的一致性，因为当你在没有集中系统的情况下开始改变状态时，它可能会变得混乱

例如，如果您的

用户

模块处于状态。您可能只需要用户名，所以

$store.state.user.username

，但我始终希望通过

getUser

公开用户，并通过

user.username

在组件上访问它

能够直接访问状态的专业人士是手表：

watch: {
  '$store.state.user' (to, from) {
    console.log('I changed!')
  }
}

这将允许您知道用户状态何时更改，但如果使用

$This.$store.dispatch（'setUser'，myUser）

您也可以在操作中执行相同的操作

---

我认为这里的关键是保持一致，选择一种方法并使用它，但始终建议遵循最佳实践。

您可以直接绑定到状态。。。。但是也要注意，如果你通过getter获取状态，你仍然可以在变异之外更改它。我想你会发现试图更改

$store.state

实际上不会更改它