hook是react16.8的新增特性。它可以讓你在不編寫class的情況下使用state的特性，換句話說就是你使用函式元件也可以使用state等屬性
4、如果頁面關閉的時候要觸發事件就直接寫在返回函式中就可以,比如關閉定時器,解綁dom事件
useeffect((
)=>},
[age]);
const
handlegohome=(
)=>);
}
usememo其實就是對屬性的快取,當別的屬性改變的時候改屬性的不渲染,如果不使用的情況下就會一起渲染
usecallback其實和usememo類似,只是乙個快取屬性乙個快取方法的，使用方式也類似
const handleage =
usecallback((
)=>
,[age]
)
usereducer的使用與上面的hook來說相對複雜點,不是一行**，一句話就可以解決的問題
2、usereducer.js檔案
import react,
from
'react'
;const initstate =
}const
reducer
=(state, action)
=>
default
:return state;}}
export
const usercontext = react.
createcontext()
;export
const
usercontextprovider
=(props)
=>
}>
<
/usercontext.provider>
)}
index.js檔案內容
import
from
'./usecontext';;
const
hookdemo
=(props)
=>
/>
<
/usercontextprovider>);
}export
default hookdemo;
import
from
'react'
;import
from
'./usecontext'
;import user from
'./user'
;const=(
)=>
=usecontext
(usercontext)
; console.
log(state,
'?')
;const
handlelogin=(
)=>)}
return
(>登入<
/button>
}<
/div>);
}export
user.js檔案
import
from
'react'
;import
from
'./usecontext'
;const
user=(
)=>
=usecontext
(usercontext)
;return
(使用者元件
名字:
<
/div>
<
/div>);
}export
default user;
import
*as store from
'./stores'
;import
from
'think-react-store'
;import log from
'think-react-store/middlewares/log'
;import user from
'./user'
;const
storedemo=(
)=>
middleware=
>
>
<
/storeprovider>);
}export
default storedemo;
一文帶你了解React 純函式元件
所謂純函式，它是這樣一種函式 即相同的輸入，永遠會得到相同的輸出，而且沒有任何可觀察的 從純函式的定義，可以提取出純函式的必要條件 先來看個例子，做下對比 let friend 非純函式 會修改函式外變數 friend 的值 function 純函式 返回乙個新物件，且不會修改引數 function...
一文搞懂property函式
接下來我帶大家了解乙個函式的作用以及使用技巧，希望對大家都有幫助，話不多說，接下來就開始我的表演特性 首先property有兩種用法，一種是作為函式的用法，一種是作為裝飾器的用法，接下來我們就逐一分析 property函式 看一下作為函式它包含的引數都有哪些 property fget none,f...
一文搞懂transform skew
目錄 如何理解斜切 skew，先看乙個 demo。在下面的 demo 中，有 4 個正方形，分別是 紅色 不做 skew 變換，綠色 x 方向變換，藍色 y 方向變換，黑色 兩個方向都變換，拖動下面的滑塊可以檢視改變 skew 角度後的效果。切換 selector 可以設定 transform or...