useState使用和原理

hooks 是 react 16 中的特性，解決函式元件想使用類元件的一些特性。

usestate

之前是在類元件中使用狀態通過 state 定義，大概**是這樣的。

import react from 'react';    

class counter extends react.component 
handleclick = () =>) 
} 
render() 
onclick=>改數字 
); 
} 
} 
function
render() 
render()

但是函式元件沒有例項，也沒有狀態。函式元件使用狀態需要使用 usestate 鉤子。

關於 usestate 的用法是，需要傳入乙個引數作為狀態的初始值，當函式執行後會返回兩個值，乙個是當前狀態的屬性，乙個是修改狀態的方法。

我們通過乙個計數器的例子，當點選按鈕表示狀態加1。

import react,  from 'react';    

function
counter() 
onclick= 
>改數字 
) 
} 
function
render() 
render()

現在我們已經掌握了它的用法，那麼我們開始分析它的原理。

原理我們需要寫乙個 usestate 方法，會返回當前狀態的屬性和設定狀態的方法，每當狀態改變之後，方法中會呼叫重新整理檢視的 render 方法。

let memoizedstate;    

function
usestate (initialstate) 
return
[memoizedstate, setstate] 
}

再次嘗試之前的**，依然可以正常使用，但是當多個 usestate 存在的時候就有問題了，只能變乙個狀態了。

function

counter() 
onclick= 
>改數字 
onclick=`) 
} 
>改標題 
) 
}

現在我們需要優化我們的 hooks ，解決多個 usestate 同時使用的問題，當多個狀態存在的時候，我們需要使用陣列儲存狀態。

let memoizedstates =    

let index = 0 
function
usestate (initialstate) 
return [memoizedstates[index++], setstate] 
} 
function
counter() 
onclick= 
>改數字 
onclick=`) 
} 
>改標題 
) 
} 
function
render() 
render()

現在已經完成了 usestate 的基本原理，當你了解原理之後，使用 hooks 就變得更加容易了。

SDWebImage原理和使用

使用場景 以下 在需要監聽網路狀態的方法中使用 afnetworkreachabilitymanager mgr afnetworkreachabilitymanager sharedmanager setitem customitem item setitem customitem item el...

TCP Fast Open原理和使用

tcp建立連線需要三次握手，這個大家都知道。但是三次握手會導致傳輸效率下降，尤其是http這種短連線的協議，雖然http有keep alive來讓一些請求頻繁的http提高效能，避免了一些三次握手的次數，但是還是希望能繞過三次握手提高效率，或者說在三次握手的同時就把資料傳輸的事情給做了，這就是我們這...

Hystrix原理和使用

構造乙個 hystrixcommand或hystrixobservablecommand物件，用於封裝請求，並在構造方法配置請求被執行需要的引數 執行命令，hystrix提供了4種執行命令的方法，後面詳述 判斷是否使用快取響應請求，若啟用了快取，且快取可用，直接使用快取響應請求。hystrix支援請...