总结
我们已经走了很长一段路。在本章中,你学习了 Vuex store
的架构、核心概念、模块结构和表单处理。至此,你应该知道 Vuex store
只是与状态(或数据)集中化和管理相关,并遵循一些你必须遵守的强制规则。因此,对于你的 store
中可能存在的任何状态属性,访问它的正确方式是在组件的计算属性中对其进行计算。如果你想更改状态属性的值,你必须通过 mutation
来修改它,mutation
必须是同步的。如果你想进行异步调用来修改状态,那么你必须使用 action
来提交 mutation
,方法是在你的组件中 dispatch
这些 action
。
你还了解到,在 Nuxt
应用中创建 store
比在 Vue
应用中更容易和更简单,因为 Vuex
默认预装在 Nuxt
中。此外,在 Nuxt
中,你不需要手动组装模块及其所有方法,因为默认情况下这些都为你完成了。此外,在 Nuxt
中,你可以使用 fetch
和 nuxtServerInit
方法在渲染页面组件和启动你的 Nuxt
应用之前,使用服务器端 API
填充 store
的 state
。最后,你已经成功地使用带有 nuxtServerInit
action 方法的 Vuex store
创建了一个简单的用户登录应用,这为在接下来的章节中创建用户登录和 API
身份验证铺平了道路。
在下一章中,我们将学习 Nuxt
中的中间件——特别是路由中间件和服务器中间件。你将学习区分这两种 Nuxt
中间件。在制作 Nuxt
应用中的中间件之前,你将使用 Vue
应用中的导航守卫创建一些路由中间件。然后,你将在 serverMiddleware
配置选项中编写一些 Nuxt
服务器中间件,作为你在第八章 “添加服务器端框架” 中学习创建的服务器端 API
的替代服务器 API
。最后但并非最不重要的一点是,你将学习如何使用 Vue CLI
创建 Vue
应用,而不是我们一直使用自定义 webpack
配置创建的 Vue
应用。所以,让我们开始吧。