在组件内部使用redux状态的最佳实践是什么?

萨巴达什

可以说我有一个大型存储对象,每个组件只需要一小部分即可。管理每个组件内部状态的最佳实践是什么?

我考虑过的两种方法,要么将内部组件状态设置为我在componentDidMount()中所需的状态片,要么将const分配给render()中的切片。每个项目的收益/缺点是什么?它们都会在发生任何更改时进行更新,并且我的所有changeHandlers都会在商店中调用操作,而不是直接修改组件状态。只是非常具体,我正在使用mapStateToProps,只需要将切片分配给一些内部变量,因为访问切片需要一个object.map,我只希望每个组件都执行一次,而不是每次需要访问状态(如果我每次都可以做this.props.storeName.someProp.value的话)

设置为内部状态

class LoginPrimaryCell extends Component {
  state = {
    data: this.props.storeFeatures.data.find(element => element.feature === 'login').settings
  }

 componentDidMount() {
     this.setState({ data: {...this.props.storeFeatures.data.find(element => element.feature === 'login').settings}})
  }

 handleChange = (event, name) => {
    this.props.editFeature({feature: 'login', setting:'checkbox', value: event.target.checked}) //editFeature is an action on store
  }

render() {
...rest of component...

分配给const

class LoginPrimaryCell extends Component {

 handleChange = (event, name) => {
    this.props.editFeature({feature: 'login', setting:'checkbox', value: event.target.checked}) //editFeature is an action on store
  }

render() {
 const data = {...this.props.storeFeatures.data.find(element => element.feature === 'login').settings}
}

我正在寻找的是针对这种情况的最佳实践,以及每种方法的优点/缺点是什么。或者,如果几乎没有区别,那全是个人喜好。谢谢!

Shubham Khatri

理想情况下,过滤/查找元素的最佳位置是memoized在mapStateToProps中使用选择器,而不是将整个数据传递到组件并在其中进行过滤,除非您要在react组件的状态内设置的条件下进行过滤。

但是,如果在某些情况下要在组件内进行过滤,则需要使用备忘功能在render方法内完成此操作,因为如果在连续渲染上传递相同的参数并且不需要处理道具或过滤器在其他任何位置发生变化。

将过滤后的数据设置为状态不是一个非常正确的解决方案,因为您将不会经常更新此状态,而且,当storeFeatures道具或过滤条件发生变化时,您将需要更新此状态,这有点麻烦

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

使用 redux 在反应中存储状态的最佳实践是什么

使用react-redux,通过redux状态将回调函数传递给通用组件的最佳实践是什么?

在vue组件中使用样式的最佳实践是什么?

在React中将状态和回调从根组件传递到叶组件的最佳实践是什么?

在reactjs构造函数redux中设置初始状态的最佳实践是什么?

将Redux状态传递到组件时的最佳实践

使用 CompositeDisposables 的最佳实践是什么

RxSwift:使用DisposeBag的最佳实践是什么?

样式组件中“ ThemeProvider”的最佳实践是什么?

构造函数内部逻辑的最佳实践是什么?(Java)

返回Java内部集合的最佳实践是什么?

在React Redux中进行复杂过滤的最佳实践是什么

RestController的最佳实践是什么?

在react中使用redux状态进行动态url更改的最佳方法是什么?

结合使用redux的最佳方法是什么?

使用Redux将响应令牌保存在react-native应用程序中的最佳实践是什么?

使用 id 作为主键的最佳实践是什么?

我在 Java 中使用大内存的最佳实践是什么?

在ReactJS中使用表单的最佳实践是什么?

使用Selenium WebDriver模拟ENTER或RETURN的最佳实践是什么

使用 Retrofit 时重试机制的最佳实践是什么?

使用kubernetes进行本地开发的最佳实践是什么?

在多线程中使用泰坦图的最佳实践是什么?

在OOP中,关于在类中使用“ this”的最佳实践是什么?

使用Xcode构建用户界面的最佳实践是什么?

在UL标签中使用多个标题的最佳实践是什么

使用Hibernate建模Java类的最佳实践是什么?

当前测试使用MapState的DoFn的最佳实践是什么

在 Java 线程中使用服务的最佳实践是什么?