跳至主要內容
版本: 0.21

Hook

Hook

Hook 是一種儲存狀態並執行副作用的函數。

Yew 內建了幾個預定義的 Hook。也可以建立自己的 Hook,或探索許多 社群製作的 Hook

Hook 規則

  1. Hook 函數的名稱必須以 use_ 開頭
  2. Hook 只可使用在以下位置
    • 函數/Hook 的最上層。
    • 函數/Hook 內部的區塊,但區塊不可已分歧。
    • 函數/Hook 內部最上層 if 敘述的條件中。
    • 深入瞭解函數/鉤子內頂層 match 表達式的審查。
  3. 每次渲染時都必須按相同順序呼叫鉤子。僅在使用 暫停 時允許提早回傳

這些規則由編譯時期或執行時期錯誤執行。

預先定義的鉤子

Yew 提供以下預先定義的鉤子

  • use_state
  • use_state_eq
  • use_memo
  • use_callback
  • use_mut_ref
  • use_node_ref
  • use_reducer
  • use_reducer_eq
  • use_effect
  • use_effect_with
  • use_context
  • use_force_update

您可以從 Yew API 文件 中找到這些鉤子的文件

自訂的鉤子

在某些情況下,您需要定義自訂的鉤子,以便將組件中可能存在的狀態邏輯封裝成可重複使用的函數。請參閱 定義自訂的鉤子 部分以取得更多資訊。

進一步閱讀

  • React 文件中有 React 鉤子 的相關部分。與 Yew 的鉤子不同,但其基本概念相似。