HTMX - 請求

HTMX 可以根據各種事件觸發請求。下面列出了用於觸發請求的最常用屬性。

• hx-get: 此屬性用於發出 GET 請求。
• hx-post: 此屬性用於發出 POST 請求。
• hx-put: 此屬性用於發出 PUT 請求。
• hx-patch: 此屬性用於發出 PATCH 請求。
• hx-delete: 此屬性用於發出 DELETE 請求。

示例：當點選按鈕時，它將向 "/submit" 傳送 POST 請求，並使用響應更新 id 為 "response-div" 的元素。

<button hx-post="/submit" hx-target="#response-div">
 Submit
</button>

請求頭

HTMX 會自動在其請求中包含一些有用的標頭。您還可以使用 hx-headers 屬性設定自定義標頭。

• HX-Request: 對於 HTMX 請求，始終設定為 "true"。
• HX-Trigger: 觸發請求的元素的 id。
• HX-Trigger-Name: 觸發請求的元素的名稱。
• HX-Target: 要更新的目標元素的 id。

示例：使用 hx-headers 屬性設定自定義標頭。

<button hx-post="/submit" hx-headers='{"My-Custom-Header": "Value"}'>
 Submit
</button>

請求引數

HTMX 會自動在其請求中包含表單值。對於 GET 請求，這些值會作為查詢引數新增到 URL 中。其他型別的請求，則包含在請求體中。您還可以使用 hx-vals 屬性指定其他引數。

<button hx-post="/submit" hx-vals='{"extra": "data"}'>
 Submit
</button>