react 爬坑记录

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 爬坑记录

最新文章

热门文章