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});

redux connect的浅比较说明的更多相关文章

  1. redux & connect

    redux & connect import React, { Component, // useState, // useEffect, } from 'react'; import { b ...

  2. [Redux] Accessing Dispatch and State with Redux -- connect

    If you have props and actions, you want one component to access those props and actions, one solutio ...

  3. redux源码浅入浅出

    运用redux有一段时间了,包括redux-thunk和redux-saga处理异步action都有一定的涉及,现在技术栈转向阿里的dva+antd,好用得不要不要的,但是需要知己知彼要对react家 ...

  4. 【温故知新】—— React/Redux/React-router4基础知识&独立团Demo

    前言:React专注View层,一切皆组件:全部使用ES6语法,最新版本为React16. Redux是专注于状态管理的库,和react解耦:单一状态,单向数据流.[独立团github地址] 一.Re ...

  5. 手写 redux 和 react-redux

    1.手写 redux redux.js /** * 手写 redux */ export function createStore(reducer) { // 当前状态 let currentStat ...

  6. BAT 前端开发面经 —— 吐血总结 前端相关片段整理——持续更新 前端基础精简总结 Web Storage You don't know js

    BAT 前端开发面经 —— 吐血总结   目录 1. Tencent 2. 阿里 3. 百度 更好阅读,请移步这里 聊之前 最近暑期实习招聘已经开始,个人目前参加了阿里的内推及腾讯和百度的实习生招聘, ...

  7. QQ音乐:React v16 新特性实践

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由QQ音乐技术团队发表于云+社区专栏 自从去年9月份 React 团队发布了 v16.0 版本开始,到18年3月刚发布的 v16.3 版 ...

  8. 【招聘App】—— React/Nodejs/MongoDB全栈项目:socket.io&聊天实现

    前言:最近在学习Redux+react+Router+Nodejs全栈开发高级课程,这里对实践过程作个记录,方便自己和大家翻阅.最终成果github地址:https://github.com/66We ...

  9. 【招聘App】—— React/Nodejs/MongoDB全栈项目:个人中心&退出登录

    前言:最近在学习Redux+react+Router+Nodejs全栈开发高级课程,这里对实践过程作个记录,方便自己和大家翻阅.最终成果github地址:https://github.com/66We ...

随机推荐

  1. Linux命令应用大词典-第10章 Shell相关命令

    10.1 commond:抑制正常的Shell函数查找 10.2 exec:使用执行命令替换当前的shell进程 10.3 bash:GNU的Bourne-Again Shell解释器 10.4 bu ...

  2. Struts2(九.初始化用户列表时显示用户照片数目)

    1.userlist.jsp //显示每个用户照片的数目(遍历每个用户) $(".picture").each(function(i,e){ $.post("${page ...

  3. 01背包问题:DP

    题目描述: 有 N 件物品和一个容量是 V 的背包.每件物品只能使用一次. 第 i 件物品的体积是 vi,价值是 wi. 求解将哪些物品装入背包,可使这些物品的总体积不超过背包容量,且总价值最大.输出 ...

  4. #pragma pack(n)对齐格式

    #pragma pack(n)对齐格式 #pragma pack(n) 是预处理器用来指定对齐格式的指令,表示n对齐.当元素字节小于n时,要扩展到n:若元素字节大于n则占用其实际大小. struct ...

  5. Spring 3整合Quartz 2实现定时任务:动态添加任务

    先展示一下后台管理定时任务效果图: 1.新增任务页面: 2.列表页(实现任务的禁用启用) 3.数据库脚本: -- ------------------------------ Table struct ...

  6. 头文件#ifndef #define #endif使用

    想必很多人都看过“头文件中的 #ifndef #define #endif 防止该头文件被重复引用”.但是是否能理解“被重复引用”是什么意思?是不能在不同的两个文件中使用include来包含这个头文件 ...

  7. location 匹配规则 (NGINX)

    转:https://moonbingbing.gitbooks.io/openresty-best-practices/ngx/nginx_local_pcre.html location 匹配规则 ...

  8. lintcode-160-寻找旋转排序数组中的最小值 II

    160-寻找旋转排序数组中的最小值 II 假设一个旋转排序的数组其起始位置是未知的(比如0 1 2 4 5 6 7 可能变成是4 5 6 7 0 1 2). 你需要找到其中最小的元素. 数组中可能存在 ...

  9. lintcode-149-买卖股票的最佳时机

    149-买卖股票的最佳时机 假设有一个数组,它的第i个元素是一支给定的股票在第i天的价格.如果你最多只允许完成一次交易(例如,一次买卖股票),设计一个算法来找出最大利润. 样例 给出一个数组样例 [3 ...

  10. C++并行编程1

    what is concurrency 我们可以一边看电视,一边唱歌.人并行非常容易理解,但是计算机呢?是不是我们一边编辑着word文档,一边听着歌,这样计算机就是在并行吗?不一定欧,如果你计算机是单 ...