本文目录导航：
React形态治理：react-redux和redux-saga(适宜由vue转到react的同窗)
留意：本文不会把一切常识点都写一遍，并不适宜纯新手阅读
首先 Redux 是一种形态治理打算，自身和react并没有什么咨询，redux也可以联合其余框架来用。
react-redux 是基于react的一种形态治理成功，他不像vuex那样间接内置在create-react-app里，须要自己去装置。
react-redux有三个关键概念，区分是：store，action，reducer。
。
store就是存储全局数据形态的仓库。
像这样：
须要留意的是，state是 只读的 ，象征着咱们不能 1 = 233 这样去修正store里的数据。 其实，上班的名目里，仓库并不是放在里，里普通是做一些创立store，注册saga的操作，state普通是放在详细模块的里（一个模块应该有，，三个文件）
。
上文说了，state是只读的，所以咱们只能经过派发action的模式修正store里的数据。
派发action这个说法我不时感觉很拗口，其实就是dispatch action的直译。
action蕴含两部分：type和payload。
type其实就是action的标识，一个常量的字符串，用来说明这个action是干嘛的，比如说 type:GET_USERNAME ，说明这个action是用来失掉username的，payload就是参数了，就是调用api须要的参数。
留意：action是派发给store的。
。
reducer接纳一个state和action，前往一个state。
store在接纳到action之后会把action和以后的state传给reducer，而后reducer依据action的type去判别口头什么样的操作，而后前往一个新的state给store，比如： return {,name:接口失掉到的username} 。
上班流程图如下：
这个流程还是蛮好懂的，接上去咱们来说下reducer要留意的中央。
（这里牵扯到咱们为什么还要用redux-saga） reducer必需是一个 纯函数 纯函数是指一个函数的前往结果只依赖于该函数传入的参数，而不能发生 反作用 反作用是指异步操作，DOM操作等... 好的，没明确是吧，说人话，reducer里是不能启动异步恳求的！咱们在上班中必需会调用接口异步失掉数据的，这样的话只靠react-redux是不可满足咱们的需求的，而redux-saga就是来处置这个疑问的。
假设你相熟vuex，就知道vuex里有mutation和action，其中mutation提交降级数据的方法，只能是同步的，而action中就可以蕴含异步操作了，而且action提交的是mutation。
mutation和action的相关就近似于reducer和saga的相关：saga里调用接口失掉到数据之后再提交action给reducer，最终前往新的state给store的还是reducer。
saga蕴含watch-saga函数和worker-saga函数，watch-saga用于监听系统派收回来的action，watch-saga一旦监听到了某个action就口头对应的worker-saga，worker-saga里启动异步操作（调用接口恳求数据等），拿到数据之后派发第二个action给store，store再把state和action给reducer（至此就和无saga时的流程一样了）。
参与了saga，上班流程出现了变动： 咱们留意到上班流中的action有两个，可以了解为第一个action是给watch-saga的，第二个action时异步操作完之后worker-saga给store的。
参与saga后的上班流程如下：
react和vue的区别及优缺陷
React和Vue的区别及优缺陷
区别：
1. 架构与成功模式
React依赖于组件化的思想，驳回函数式编程的模式，并重于形态治理和组件复用。
Vue则愈加器重照应式的数据绑定和组件组合模式，愈加灵敏轻巧。
2. 数据降级机制
React关键经过组件生命周期方法降级界面形态和数据。
而Vue驳回照应式机制，当数据出现变动时，视图会智能降级。
这使得Vue在数据照应方面更为高效。
好处：
* 组件化开发模式明晰，无利于团队单干。
* 生态系统完善，提供了少量的库和工具用于前端集成与开发。
* 共同的渲染机制使得性能优化更为灵敏。
* 照应式编程模型直观易懂，学习老本低。
* 轻量级框架，实用于小型名目或大型名目标部分开发。
* 提供了丰盛的指令和插件系统，繁难开发者极速构建运行。
缺陷：
* 因为函数式编程的思想，关于初学者或者有必定的门槛。
并且代码组织和逻辑相对复杂，须要较高的形象思想。
另外，因为其宏大的生态系统，选用适宜的库和工具或者须要期间。
但这也造成了丰盛的生态和少量处置打算的或者性。
但在成功大型名目时或者会遇到性能疑问。
不过经过优化，这些性能疑问是可以处置的。
另外React运行或者因为组件复杂而造成开发环节中发生少量冗余代码和复杂的依赖相关治理。
所以其性能和治理须要破费更多期间和精神。
但其经过React Native还可以轻松构建跨平台运行的好处也是十分显著的。
这象征着只有要一套代码就能同时允许Android和iOS等系统，大大缩小开发和保养老本和期间投入。
前端类库 - React Query 入门（一）
React Query 入门：简化前端数据治理React Query 是一款弱小的前端数据失掉库，它简化了数据失掉、缓存、同步和降级主机形态的环节，使得在 React 程序中治理数据变得更轻松。
它不只实用于 React 中的 server-client 形态同步，还能处置诸如离线存储、阅读器裁减等异步场景，从而优化运行程序性能和用户体验。
相较于传统的客户端形态治理，如 redux、zustand 等，React Query 经过将服务端形态独立进去，降落了全局形态治理的复杂性。
它能规范接口恳求，确保每个接口形态的明晰治理，从而成功页面照应式降级，优化用户交互体验。
在某些状况下，服务端形态治理可以与客户端形态治理相联合，但须要留意其在恳求形态控制缓和存战略上的差异，以防止潜在疑问。
基础经常使用方面，经过 useQuery，咱们可以简化数据恳求的治理，智能处置 loading 和 error 形态。
它接受一个查问键和恳求函数，前者用于治理形态，后者担任远程数据失掉。
而 useMutation 则用于控制数据的降级操作，它对异步函数启动了优化，参与了生命周期回调，繁难在不同场景下口头特定义务。
在缓存战略上，React Query 驳回 stale-while-revalidate，这象征着数据或者不是最新，但会实时降级。
开发者需依据运行场景判别能否接受过期数据，并经过 useMutation 肃清缓存，确保数据降级后页面的正确渲染。
总结来说，React Query 提供了高效、规范的数据治理打算，协助开发者从全局形态治理中摆脱进去，提高名目标可保养性和灵敏性。
经过学习和运行，可以优化名目中的数据恳求，优化全体开发效率。
