hooks 是 react 16 中的特性,解決函式元件想使用類元件的一些特性。
一般在函式元件裡使用該hooks調介面獲取資料
useeffect不傳遞第二個引數會導致每次渲染都會執行useeffect。然後,當它執行時,它獲取資料並更新狀態。然後,一旦狀態更新,元件將重新呈現,這將再次觸發useeffect
remark:useeffect的第二個引數為乙個陣列,如果想在特定的邏輯裡面執行相關**,可以操作該陣列,陣列裡可以存放狀態
獲取getstate方法,getstate與useselelctor功能類似
共享狀態,從redux的store物件中提取資料(state)。
const obj=useselector(state=>state.obj)
簡單好用!!!
import from 'react-redux';
返回redux store中對dispatch函式的引用。你可以根據需要使用它。
const dispatch = usedispatch();
import from 'react-redux';
上下文 如果需要在元件之間共享狀態,可以使用usecontext()。
在兩個子元件上建立createcontext()
reducer的代替品,接受兩個引數
傳遞「建立」函式和一系列依賴項。usememo僅在其中乙個依賴項已更改時才重新計算儲存的值。此優化有助於避免對每個渲染進行昂貴的計算。
const history = usehistory();
function handleclick()
//有時列印history為undefined
函式元件
import react from 'react』
import from 'react-router-dom』
export const buttonwithrouter = withrouter(() => )
//類元件
import react from "react";
import from "react-router-dom";
class mycomponent extends react.component
...}export default withrouter(mycomponent);
返回乙個有狀態值,以及乙個更新它的函式。
ref可以用來獲取元件例項物件或者是dom物件。
而useref這個hooks函式,除了傳統的用法之外,它還可以「跨渲染週期」儲存資料。
接受兩個引數,函式和依賴項,可以快取上次的函式減小建立函式的代價
可以通過配合useref、forwordref將子元件的屬性和方法傳給父元件使用
React Hooks 學習概覽
react hooks的函式 元件方式代替原來的類繼承,簡化 風格,好處是大大的 1 usestate用來宣告狀態變數。要從三方面掌握 宣告 讀取 使用。注意 usestae是不能進行條件語句判斷的 2 useeffect就相當於 類元件中的 componentdidmount componentd...
對於React Hooks的理解
react元件可以分為類元件和函式元件。類元件具有生命週期 狀態,而函式元件卻沒有。在react 16.8新出來的hooks 可以讓react函式元件具有狀態,並且提供了類似componentdidmount和componentdidupdate等生命週期方法。栗子?我們寫乙個函式元件,如果想要更新...
redis學習 補充學習
redis是乙個開源的記憶體中的資料結構儲存系統,它可以用作 資料庫 快取和訊息中介軟體。是乙個完全開源免費的key value記憶體資料庫通常被認為是乙個資料結構伺服器,主要是因為其有著豐富的資料結構strings map list sets sorted sets1 完全基於記憶體,絕大部分請求...