1.父子组件优化其一
发生render条件:数据改变(state或者props改变),有时子组件会过多render.这时可在子组件里面的生命周期钩子里执行

shouldComponentUpdate(nextProps,nextState){
if(nextProps.context !== this.props.context){
    return true;
  }else{
     return false;
  }
}

来减少不必要的render.

2.优化其一:

尽量把bing放在constructor里面或者使用箭头函数

3.优化其二:
把只有render函数的组件改为无状态组件,可以减少很多生命周期函数的调用.

4.使用styled-components引入injectGlobal报错.

因为最新的版本已经去除了injectGlobal.可以改为

import {createGlobalStyle} from 'styled-components';

export const GlobalStyled = createGlobalStyle`
body{
margin:;
padding:;
background:red;
}`

5.使用react-router-dom的Link跳转时,发生

Error: Invariant failed: You should not use <Link> outside a <Router>

顾名思义,该组件需要放在BrowserRouter里面才能使用Link

 

后续,工作中遇到再学再写

react 爬坑记录的更多相关文章

  1. mybatis-generator 详细配置及使用,爬坑记录

    mybatis-generator 详细配置及使用,爬坑记录 提示:如果不成功一定是项目路径和 数据库配置出问题,本篇基于 MySQL 8.0.13,调试没有问题. 如果失败,建议使用相同的项目结构, ...

  2. React爬坑秘籍(一)——提升渲染性能

    React爬坑秘籍(一)--提升渲染性能 ##前言 来到腾讯实习后,有幸八月份开始了腾讯办公助手PC端的开发.因为办公助手主推的是移动端,所以导师也是大胆的让我们实习生来技术选型并开发,他来做code ...

  3. centos7安装Mysql爬坑记录

    centos7安装Mysql爬坑记录   查看是否已安装 使用下列命令查看是否已经安装过mysql/mariadb/PostgreSQL 如果未安装,不返回任何结果(ECS的centos镜像默认未安装 ...

  4. elasticsearch 单节点搭建与爬坑记录

    elasticsearch 单节点搭建与爬坑记录   prepare   虚拟机或者云服务器(这里用的是阿里云ECS) linux---centos7 安装完毕的jdk 相应的安装包(在https:/ ...

  5. 03、Swagger2和Springmvc整合详细记录(爬坑记录)

    时间 内容 备注 2018年6月18日 基本使用 spirngmvc整合swagger2 开始之前这个系列博文基本是,在项目的使用中一些模块的内容记录,但是后期逐渐优化,不单单是整合内容. swagg ...

  6. vuex2.0.0爬坑记录 -- mutations的第一个参数state不能解构

    今天在学习vuex的过程中,遇到了一个很困扰人的问题,最终利用vuex的状态快照工具logger解决了问题. 问题是这样的,我在子组件中使用了mapState()函数来将状态映射至子组件中,使子组件能 ...

  7. JdbcTemplate的一次爬坑记录

    时隔三个多月,我终于想起我还有个博客,其实也不是忘了我这个博客,只是平时工作繁忙没时间去写博客,故今晚腾出时间来记录一下上次工作中遇到的一个问题,给园友们分享出来,以免入坑. 上个星期在工作中使用Jd ...

  8. react爬坑之路(一)--报错output.path不是绝对路径

    之前,一直在纠结是学习angular好,学习vue好,还是学习react好,网上一搜索,也是各种对比,各种互喷,看过之后更纠结.就跟小时候一样纠结长大了是上清华好,还是上北大好,最后证明我想多了.总之 ...

  9. mac M1 php扩展 xlswriter 编译安装爬坑记录

    电脑配置 MacBook Pro(14英寸,2021年) 系统版本 macOS Monterey 12.4 芯片 Apple M1 Pro PHP环境 MAMP Pro Version 6.6.1 ( ...

随机推荐

  1. 模板语言、url

    伪造一个数据库全局变量 (字典无序) USER_LIST 列表变字典(元祖和列表直接循环就好,字典涉及到k_v) UESR_DICT 遍历方法 1. 2. 3. 4. 5. 6.键入链接 通过a标签包 ...

  2. Python进阶-IV-Wrapper高阶

    一.装饰器回顾: 1.标准的装饰器示例 def trapper(func): def inner(*args, **kwargs): print('插入到被装饰函数前的功能!') res = func ...

  3. Pandas | 20 级联

    Pandas提供了各种工具(功能),可以轻松地将Series,DataFrame和Panel对象组合在一起. pd.concat(objs,axis=0,join='outer',join_axes= ...

  4. SpreadJS 生成报表

    空了再写个完整的demo吧 //报表控件 输入参数待定 function SpreadObj(response) { var spread = null; //数据列表 var dataArray = ...

  5. CF 494E Sharti

    CF 494E Sharti 题意:一个\(n \times n\)的棋盘,共有m个矩形中的格子为白色.两个人需要博弈,每次操作选择一个边长不超过k的正方形并翻转颜色,每次翻转需要正方形的右下角为白色 ...

  6. SCDM导入点数据

    我们有时候需要把外部的点导入SCDM当中,但是SCDM没有像ICEM或者DM那样直接提供点导入的选项,是不是SCDM就无法导入点的数据了呢?答案当然是否定的.把点导入SCDM中的方法总结如下(示例数据 ...

  7. git修改远程仓库名称[gitolite]

    参考 https://stackoverflow.com/questions/4708465/how-do-i-rename-a-git-repository-created-with-gitolit ...

  8. sqlException 使用relace 替换单引号

    我们从前端输入数据的时候,可能会输入一些 单引号 ,的字符 导致直接进行执行sql 语句保存的时候出现错误 如: 输入的有 单引号 保存按钮小代码 <asp:Button ID="bt ...

  9. [转帖]springboot2.0配置连接池(hikari、druid)

    springboot2.0配置连接池(hikari.druid) 原文链接:https://www.cnblogs.com/blog5277/p/10660689.html 原文作者:博客园--曲高终 ...

  10. 最小生成树 --- 求最小权值、MST

    Agri-Net Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 37109   Accepted: 14982 Descri ...