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});
redux connect的浅比较说明的更多相关文章
- redux & connect
redux & connect import React, { Component, // useState, // useEffect, } from 'react'; import { b ...
- [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 ...
- redux源码浅入浅出
运用redux有一段时间了,包括redux-thunk和redux-saga处理异步action都有一定的涉及,现在技术栈转向阿里的dva+antd,好用得不要不要的,但是需要知己知彼要对react家 ...
- 【温故知新】—— React/Redux/React-router4基础知识&独立团Demo
前言:React专注View层,一切皆组件:全部使用ES6语法,最新版本为React16. Redux是专注于状态管理的库,和react解耦:单一状态,单向数据流.[独立团github地址] 一.Re ...
- 手写 redux 和 react-redux
1.手写 redux redux.js /** * 手写 redux */ export function createStore(reducer) { // 当前状态 let currentStat ...
- BAT 前端开发面经 —— 吐血总结 前端相关片段整理——持续更新 前端基础精简总结 Web Storage You don't know js
BAT 前端开发面经 —— 吐血总结 目录 1. Tencent 2. 阿里 3. 百度 更好阅读,请移步这里 聊之前 最近暑期实习招聘已经开始,个人目前参加了阿里的内推及腾讯和百度的实习生招聘, ...
- QQ音乐:React v16 新特性实践
欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由QQ音乐技术团队发表于云+社区专栏 自从去年9月份 React 团队发布了 v16.0 版本开始,到18年3月刚发布的 v16.3 版 ...
- 【招聘App】—— React/Nodejs/MongoDB全栈项目:socket.io&聊天实现
前言:最近在学习Redux+react+Router+Nodejs全栈开发高级课程,这里对实践过程作个记录,方便自己和大家翻阅.最终成果github地址:https://github.com/66We ...
- 【招聘App】—— React/Nodejs/MongoDB全栈项目:个人中心&退出登录
前言:最近在学习Redux+react+Router+Nodejs全栈开发高级课程,这里对实践过程作个记录,方便自己和大家翻阅.最终成果github地址:https://github.com/66We ...
随机推荐
- Fiddler使用总结(二)
在上一篇中介绍了Fiddler的基本使用方法.通过上一篇的操作我们可以直接抓取浏览器的数据包.但在APP测试中,我们需要抓取手机APP上的数据包,应该怎么操作呢? Andriod配置方法: .确保手机 ...
- 破解IDEA注册码,设置 license server一直有效不过期
破解的详细过程: 1.从下面地址下载一个jar包,名称是 JetbrainsCrack-2.10-release-enc.jar 下载地址是http://idea.lanyus.com/,进去之后点 ...
- Linux命令应用大词典-第9章 数字计算
9.1 bc:任意精度的计算器 9.2 dc:一个任意精度的计算器 9.3 expr:将表达式的值打印到标准输出 9.1 bc:任意精度的计算器 9.2 dc:一个任意精度的计算器 9.3 expr: ...
- Python内嵌函数与Lambda表达式
//2018.10.29 内嵌函数与lambda 表达式 1.如果在内嵌函数中需要改变全局变量的时候需要用到global语句对于变 量进行一定的说明与定义 2.内部的嵌套函数不可以直接在外部进行访问 ...
- 游戏AI之群组行为
群组行为指的是多个对象组队同时进行的情况.每个boid需满足分离,队列,凝聚三个基本的规则. 分离:群组中的每个个体都与相邻的个体保持一定的距离. 队列:群组以相同的速度,向相同的方向移动. 凝聚:与 ...
- unable to access android sdk add-on list and SDK 更新镜像设置
前记 国内的网络呀,真是操蛋!!!!!! unable to access android sdk add-on list 在 Android Studio 安装目录 bin/idea.propert ...
- * 197. Permutation Index【LintCode by java】
Description Given a permutation which contains no repeated number, find its index in all the permuta ...
- 关于java中“使用了未经检查或不安全的操作、有关详细信息,请使用 ——Xlint:unchecked重新编译”
今天看<算法 第4版>排序章节时,发现了一个了一个小问题.先贴一下代码: public class Selection{ public static void main(String[]a ...
- 【上传-下载】-jmeter工具
上 传 ================================================================================================ ...
- 在本地电脑使用远程服务器的图形界面——包括 MATLAB、PyCharm 等各种软件
在用本地电脑连接远程服务器的时候,大部分时候只能用命令行来操作.虽然可以 在本地电脑用 PyCharm 进行远程调试.在本地电脑远程使用服务器的 Jupyter Notebook.Ubuntu 和 W ...