HTMX - 響應

HTMX 處理響應的主要方式是使用從伺服器返回的內容更新目標元素。

• HTML：最常見的響應型別，直接插入到目標元素中。
• 純文字：作為文字內容插入。
• JSON：可與 HX-Reswap 標頭配合使用，以控制如何插入內容。

響應標頭

HTMX 識別了幾個特殊的響應標頭，它們可以控制其行為。

• HX-Trigger：觸發客戶端事件。
• HX-Refresh：如果為“true”，則觸發全頁重新整理。
• HX-Redirect：觸發客戶端重定向。
• HX-Reswap：控制如何交換響應內容。

示例：這是一段伺服器端程式碼。

from flask import make_response

@app.route('/submit', methods=['POST'])
def submit():
    response = make_response("
Success!
")
    response.headers['HX-Trigger'] = 'showMessage'
    return response

錯誤處理

HTMX 提供了內建錯誤處理功能。預設情況下，它會將錯誤中返回的任何內容交換到目標元素中。你還可以監聽 htmx:responseError 事件來更具體地處理錯誤。

document.body.addEventListener('htmx:responseError', function(evt) {
    alert('There was an error: ' + evt.detail.error);
  });