1. 減少子元件渲染
當 父元件 state 內的某個值(eg:value) 不變時 子元件菜 render
shouldcomponentupdate(nextprops, nextstate){
// 當父元件傳遞到子元件的值不同時 子元件才渲染
return nextprops.value !== this.props.value;
2. 函式作用域繫結 解除安裝 constructor 內
// 只用繫結一次作用域 降低效能消耗 可以 避免無謂的渲染
constructor(props){
super(props);
this.clickevent = this.clickevent.bind(this);
3. setstate 是非同步操作 寫成非同步匿名函式 可以把多次 資料修改渲染 結合成一次來做
this.setstate((prevstate)=>({
array1 : [...prevstate, str1,str2,str3],
string : 'this is string'
4. 虛擬dom
5. 同層比對
react16實戰總結
react實戰基礎 li裡要帶key值否則會警告,這個問題在vue中也存在,考慮到虛擬dom中diff,所以不要用index作為key值,而要用item。2.immutable state不允許我們做任何的改變,所以拷貝乙份list,修改完再用setsate設定 removeclick index ...
react16的新特性
react 16 的好處 1 新的核心演算法 fiber react 新的演算法,更加友好 2 render可以return陣列 字串 可以return陣列 不需要包div 但是必須有對應的key 3 錯誤處理機制 增加了拋異常的生命週期函式 componentdidcatch err,info 這...
react 版權問題 React 16 兩三事
這兩天 react 16 發布了,同時,react 16 與 15.6.x 都已經切換到 mit 協議。版權的熱議與一些公司的決斷對於整個社群而言看起來是個好事,同時,也給前端的元件化帶來了更多的思考。react 16 大致有以下改變 新的 fiber render 引擎 以支援許多原來做不到的關於...