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. 三分钟小课堂-----------------docker(三)增删改查命令

    主要为docker容器的增删改查命令 1  创建容器: docker run   -it   --name 别名  image_name   /bin/bash --name 别名 -d 后台 -t ...

  2. Linux命令应用大词典-第40章 网络客户端

    40.1 elinks:字符模式的Web浏览器 40.2 wget:从Web网站下载文件 40.3 curl:传输URL 40.4 lynx:通用分布式信息的万维网浏览器 40.5 lftp:实现文件 ...

  3. IntelliJ IDEA 新建项目

    一 新建一个Java项目 二 新建一个Web项目 三 新建一个Maven项目 四 web.xml常见版本 <?xml version="1.0" encoding=" ...

  4. Anyproxy抓包工具

    1.安装Nodejs和AnyProxy以及安装模拟器(移动端抓包工具) 第一步:nodejs下载地址:http://nodejs.cn/download/ 下载Windows版本,直接运行安装即可, ...

  5. bson文件的切分

    描述 最近遇到问题需要将较大的bson文件(MongoDB导出的二进制json文件)按文档(记录)进行切分,网上这方面的资料实在太少,弄了一天多终于达到了基本要求(还不知道有没有BUG) 代码 pac ...

  6. ionic 日期插件学习

    <ion-header> <ion-navbar> <ion-title> DateTime </ion-title> </ion-navbar& ...

  7. 【shell 练习5】编写简单的多级菜单

    一.简单的多级菜单 [root@web129 ~]# cat menu.sh #!/bin/bash #shell菜单演示 function menu() { echo -e `date` cat & ...

  8. ArcFaceDemo 第二版【C#】——视频人脸识别

    啥话不说,不用跪求,直接给下载地址:http://common.tenzont.com/comdll/arcface2demo.zip(话说附件的大小不限制,还是说我的文件太大,实际上确实有点大,60 ...

  9. 一:yarn 介绍

        yarn的了出现主要是为了拆分jobtracker的两个核心功能:资源管理和任务监控,分别对应resouceManager(RM)和applicationManager(AM).yarn中的任 ...

  10. 如何理解*p++

    后置递增运算符的优先级高于解引用运算符! *p++ 等价于 *(p++) 但是,我们*p++的求值结果不可理解为p+1指向的对象的值,而应该是p指向的对象的值. 这是由于后置++的特性引起的. *p+ ...