
React和Redux是朋友,彼此互补。 React Components可以订阅Redux存储,并且一旦状态(Redux状态)发生改变,这些组件就会重新渲染。 因此,订阅Redux的任何组件都会在状态更改时重新呈现。 这就是重点!
如您所知,重新渲染可能不是一个好主意,这是需要优化React Redux应用程序的主要原因,这是Reselect的主要目的。
但是, 选择器是什么? 选择器是可以计算或从存储中检索数据的功能。 我们通常使用mapStateToProps函数获取状态数据:
const getSomeData =(someData,isActive){
返回someData.find(d => d.isActive === isActive)
}
const mapStateToProps =(状态)=> {
返回 {
someData:getSomeData(state.someData,state.isActive)
}
}
在上面的示例中,getActiveData方法从someData返回状态为active的所有记录。 问题在于,只要状态的任何部分更新,此函数都会重新计算该数据。 当然,在这种特殊情况下,计算非常简单,但是如果每次Redux存储更新时此计算花费几秒钟,该怎么办。
- React Native允许您构建这四种类型的移动应用程序。
- Instalar el maravilloso静态检查器llamado Flow😄
- 当我们使用Ionic时,React Native或构建Native应用程序。
- 虚拟DOM与真实DOM,Angular与React,Framework与Libraries,SPA与MPA
- JavaScript #JavaScript的日子。
这是重新选择播放的地方。 重新选择的作用是除非输入参数不变,否则重新计算不会发生。
重新选择将输入自变量缓存到已记忆的函数。 因此,仅当函数的参数与上一次调用不同时,选择器才会重新计算。
const getSomeData =(someData,isActive){
返回someData.find(d => d.isActive === isActive)
}
const makeGetSomeData = createSelector ([ getSomeData ],(data,active)=> {
return(someData)=> someData
}
Reselect提供了一个createSelector API,用于创建备注选择器。 createSelector将输入选择器数组和一个转换函数作为其参数。 如果输入选择器的值与先前对选择器的调用相同,则它将返回先前计算的值。
那是所有人
谢谢阅读!
reduxjs /重新选择
重新选择– Redux github.com的选择器库