zoukankan      html  css  js  c++  java
  • redux connect的浅比较说明

    redux的connect方法是一个高阶组件,对包装的组件会在ShouldComponentUpdate中实现一个默认的浅比较。

    connect形式如下:

    connect([mapStateToProps], [mapDispatchToProps], [mergeProps], [options])

    其中options参数如下:

    [pure] (Boolean): 如果参数为true,用来避免重新渲染并调用mapStateToProps、mapDispatchToProps和mergeProps时基于各自的等值比较函数来比较所涉及到的state和props对象。
    [areStatesEqual] (Function): 如果参数pure为true,用来比较传入的store与之前的store值。默认值: strictEqual (===)。
    [areOwnPropsEqual] (Function):如果参数pure为true,用来比较传入的props与之前的props值。默认值: strictEqual (===)。
    [areStatePropsEqual] (Function):如果参数pure为true,用以比较mapStateToProps函数的结果与之前的结果值。
    [areMergedPropsEqual] (Function): 如果参数pure为true,比较mergeProps函数的结果与之前的值。默认值为:shallowEqual。
    [storeKey] (String): 用以从context获取store的key值。你仅仅可能在有多个store值的情况下才需要这个选项,默认值为:store。

    pure参数为true,会进行浅比较,为false,总是返回true,直接渲染。默认为true,相当于实现了一个pureComponent。

    若发生组件不更新的问题,可以考虑关闭默认的浅比较,connect(null, null, null, {pure: false});

  • 相关阅读:
    设计模式之GOF23外观模式
    设计模式之GOF23装饰模式
    设计模式之GOF23组合模式
    设计模式之GOF23桥接模式
    设计模式之GOF23代理模式03
    设计模式之GOF23代理模式02
    设计模式之GOF23代理模式01
    设计模式之GOF23适配器模式
    设计模式之GOF23原型模式02
    设计模式之GOF23原型模式01
  • 原文地址:https://www.cnblogs.com/mengff/p/9718182.html
Copyright © 2011-2022 走看看