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>