react-redux提供了兩個api
provide主要是將store分發傳遞下去，而我們在元件中需要去消費store時，可以使用connect將狀態和派發函式對映到元件中直接使用。
下面對這兩個api 實現 hook 版本。
const context = react.
createcontext()
export
const
provider=(
)=>
>
<
/context.provider>
)}
connect是乙個hoc工廠函式，對傳入的元件附加額外的props，再返回。通過兩個對映函式，將store中的狀態和派發動作函式繫結到元件的props。同時訂閱檢視的更新。
可以將功能拆分為：
const context = react.
createcontext()
export
const
connect=(
mapstatetoprops
= state => state,
mapdispatchtoprops =
)=> component => props =>
}// 4. 將action轉換為可執行的函式，其實就是在外麵包一層dispatch
function
bindactioncreators
(creators, dispatch)
for(
let key in creators)
return actionobj
}function
bindactioncreator
(creator, dispatch)
)return
(...args)
=>
dispatch
(creator
(...args))}
// 5. 最後我們還要坐下檢視的更新
useeffect((
)=>)}
)},[moreprops]
)// 1. 接受乙個元件，返回乙個新的元件，同時給該元件傳遞一些新的props
return
/>
}
// store還是用之前計數器的栗子
import store from
'./store/myreactreduxstore'
// 這裡引入我們自己寫的zreactredux
import
from
'./zreactredux'
reactdom.
render
(>
>
<
/provider>
, document.
getelementbyid
('root'))
;
import react,
from
'react'
// 這裡換成我們自己寫的zreactredux
import
from
'../zreactredux'
import
from
'../action/counteraction'
class
myreactreduxpage
extends
component
render()
=this
.props
return
(<
/p>
>加<
/button>
>非同步加<
/button>
>減<
/button>
<
/div>);
}}export
default
connect
( state =>()
,)(myreactreduxpage)
;
現在我們來實現一下這個判斷處理，先看下傳入乙個函式是怎麼用的
connect
( state =>()
,// 傳入物件，action函式
// 傳入乙個函式，其實也是返回派發函式的具體實現
dispatch =>()
, asyncadd:
(...args)
=>)}
,1000)}
}))(myreactreduxpage)
;
function
getmoreprops()
if(!mapdispatchtoprops)
}elseif(
typeof mapdispatchtoprops ===
'function'
)else
return
}
mysql手寫 mysql手寫
mysql手記 myisam innodb是mysql常用的儲存引擎 myisam不支援事務 也不支援外來鍵，但其訪問速度快，對事務完整性沒有要求。innodb儲存引擎提供了具有提交 回滾和崩潰恢復能力的事務安全。但是比起myisam儲存引擎，innodb寫的處理效率差一些並且會占用更多的 mysq...
前端手寫系列 手寫reduce函式
reduce函式常用於對陣列，reduce函式接受3個引數 被迭代的陣列 用於迭代計算的函式 迭代的初始值 注意點 如果沒有提供初始值時，會預設使用陣列的第乙個元素來作為初始值 function reduce arr,callback,initialval 如果沒有將initialval傳遞給該函式...
手寫數字識別
這幾天在想這做字元識別方面的程式，看了很多 但是發現 上的幾乎用處都不是特別的大，理論一大堆，但是用在程式裡面則很難實現，看到有些 上說用連碼法，但是連碼法對結構的變化太敏感了，但是也從一些 裡獲得了一些靈感，我採用的是網格匹配法，準備工作採集樣本，得到了樣本的網格資訊用於接下來的識別，當然也可 一...