You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1.7 KiB
1.7 KiB
React 状态管理工具的简单思考
在组件间传值是一个老生常谈的问题，对于大型且复杂的项目来说，有许多优秀的状态管理库例如： Redux、Mobx之类的工具帮助统一的管理和分发状态，但是在小型的个人项目当中，引入复杂的状态管理不但不会提高项目的开发效率还可能会提高开发者的心智负担，如果只是需要简单的在兄弟组件层级中传递参数，React 也提供了 Context 这样的方案用于组件共享值，在这里是对常见的状态管理工具做一个简单的思考
1. Redux
Redux 是我在写 React 应用的时候状态管理的首选方案，只是因为我比较熟悉，Redux 可以应用但不限于在 React 框架甚至还可以运用在 Vue 和 VanillaJS 当中，Redux 的再封装库非常多，React-Redux、Redux-Toolkit、Dva等
2.Context
Context 是 React 官方提供的组件间传值共享值的解决方案，对于一些小心应用，Context 就已经足够满足状态传递的需求，但是这也会导致一些问题，比如说组件的复用性变差，React 官网中也有写到：如果你只是想避免使用状态提示的过程中出现的值层层传递的问题，可能控制反转的组件组合会相较于 Context 更加适合，什么是组件组合？就是说原先在组件间层层传递的参数，变为传递一个组件自身，这种对组件的控制反转减少了需要传递的 props 数量
3. React Query / Swr
这两个工具实际上相较于前两个有较大的不同，Redux 和 Context 可以同时管理用户交互的中间状态，但是对于这两个工具而言，主要是负责服务端状态的管理，