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:0;
    padding:0;
    background:red;
}`

 

 5.使用react-router-dom的Link跳轉時,發生

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

 顧名思義,該組件需要放在BrowserRouter里面才能使用Link

 

 

 

后續,工作中遇到再學再寫