除錯 - daniel-qa/Vue GitHub Wiki
除錯
- Chrome DevTools 的 Event Listener Breakpoints
只要 DOM 或物件觸發某些事件時,Chrome 會自動停在處理事件的程式碼上!
這功能特別適合偵錯那些 不知道從哪裡被綁定的事件。
在 DevTools → Sources → Event Listener Breakpoints 右側面板中,這裡會列出所有事件分類:
分類 | 常見用途 |
---|---|
Mouse | click、dblclick、mousedown、mouseup、mouseenter 🔥 |
Keyboard | keydown、keyup、keypress |
XHR / Fetch | AJAX 請求 (axios、fetch) 偵錯最強搭檔 🔥 |
Timer | setTimeout、setInterval |
UI | scroll、resize、input |
Animation | requestAnimationFrame |
Clipboard | copy、paste |
Touch | touchstart、touchend |
Web Audio | 音訊事件 |
- Debug JavaScript
https://developer.chrome.com/docs/devtools/javascript?hl=zh-tw
- 在 Chrome 中啟用非同步偵錯功能
https://learn.microsoft.com/zh-tw/visualstudio/javascript/debug-nodejs?view=vs-2022