# Vuex和provide、inject在项目中使用取舍
# 1.1 vuex全局管理的不二选择
这里使用vuex官网的一句话描述:它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。
通过官网简介我们提取一下主要关键点,集中式、管理组件状态、可预测的方式
作为SPA前端开发框架,Vue父子组件之间的传值通信使用Props、多个组件之间的计算属性、方法公用一个属性时,vuex是推荐采用的一种状态管理中心。
通过中心管理状态让数据在不同组件之间更有利于管理,数据流向、数据改变、数据计算都形成统一的管理,项目中状态管理相对其他方式来说更清晰。
# 1.2 provide、inject多层嵌套组件通信必备
- provide:Object | () => Object
- inject:Array
| { [key: string]: string | Symbol | Object }
对于多个嵌套较深的组件来说一层一层通过Props和事$emit传值是一件极其痛苦的事情。
provide和inject数据变更不是响应式的,响应式的数据需要return一个一个响应式的数据。
# 1.3 项目中关于vuex和provide、inject的取舍
- 关注点: vuex的关注点从整个项目出发,不关注组件之间的嵌套关系,对项目中全局的状态做廷统一管理,provied和inject更关注基础组件之间的传值通信。
- 响应式:vuex的state,getter都是响应式数据,provide提供的数据可以是响应式也可以不是响应式。
- 可预测:vuex中mutation负责更改state,通过提交mutation的事件可预测性知晓数据的变化,provide中的数据变更不易被预测,绑定的数据如果是响应式数据,数组,对象的变化不会被监听到。
- 命名空间:vuex中支持module模式,各个module之间可使用命名空间保持数据隔离,provide中不提供命名空间。
创建人:yinyanting