🔧 开发问题

Q: 请求没有发送？

A: 检查以下几点：

  • 确保加载了 HTMX 脚本
  • 检查 hx-get/hx-post 属性是否正确
  • 查看浏览器开发者工具的网络面板
  • 检查是否有 JavaScript 错误

Q: 响应内容没有显示？

A: 检查：

  • hx-target 是否指向正确的元素
  • 服务器返回的是 HTML 而非 JSON
  • Content-Type 是 text/html

Q: 如何调试？

A: 使用 htmx.logAll()：

javascript
htmx.logAll(); // 开启详细日志

⚡ 性能问题

Q: 如何优化性能？

  • 使用 delay 和 throttle 减少请求
  • 使用 hx-indicator 提供加载反馈
  • 合理使用 hx-trigger
  • 服务器返回最小化的 HTML

Q: 输入时请求太频繁？

A: 使用 delay：

html
<input hx-get="/search" hx-trigger="input delay:500ms">

🌐 CORS 问题

Q: 跨域请求失败？

A: 服务器需要设置 CORS 头：

http
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, PUT, DELETE
Access-Control-Allow-Headers: *

🔌 框架集成

Q: 如何与 React/Vue 配合？

A: HTMX 可以与框架共存：

  • 静态部分用 HTMX
  • 复杂交互用 React/Vue 组件
  • 使用 hx-on 监听 HTMX 事件

🔗 相关资源