Chrome開發工具中的調試技巧

以下是我正在調試的Redux代碼片段，沒有什麼特別的。我的問題是關於在Chrome開發工具中調試它。Chrome開發工具中的調試技巧

問題是在回調.then(({ data }) => dispatch({中設置斷點（bp）。我可以在這條線上設置一個bp，但是由於箭頭函數調度的原因，我不能在這個函數中設置user: data.results[0],的bp。

我能做些什麼來設置一個基點，這樣我可以檢查data或data.results[0]
我可以以某種方式進入調試許鏈？

export const login = (username, password) => (dispatch) => { 
    return dispatch({ 
    type: LOGIN, 
    payload: { 
     username, 
     password, 
    } 
    }) 
    .then(({ data }) => dispatch({ 
    type: LOGIN_SUCCESS, 
    payload: { 
     user: data.results[0], 
    }, 
    })) 
    .catch((error) => { 
    dispatch({ 
     type: LOGIN_FAIL, 
     payload: { 
     error: error.message, 
     }, 
    }); 
    }); 
};

來源

2017-10-11 Rory

爲什麼不只是包裝在大括號調用'dispatch'以同樣的方式作爲.catch？那麼這是一個單獨的聲明，你可以斷點。是的，最終的代碼並不一定需要它，但好的代碼讓你可以很容易地進行調試 - 使用什麼讓你的生活變得最簡單，不一定是絕對乾淨的代碼 –

據說Chrome可以[處理內聯函數和箭頭的斷點]（現在https://umaar.com/dev-tips/129-inline-breakpoints/）。雖然在使用源代碼時並不適用於我 - 但您可能獲得更多成功 – CodingIntrigue

Cheers James＆Codingintrigue – Rory

-3

你試過

debugger;

？

這是相同的破發點，但不要忘了調試後刪除=）

來源

2017-10-11 12:06:15 shiroma

這將是多餘的。爲了引入一個'debugger;'語句，你需要引入一個代碼塊。無論如何，你可以設置一個斷點...... – CodingIntrigue

替換。然後用文本功能如下：

.then(function({ data }) { 
    dispatch({ 
     type: LOGIN_SUCCESS, 
     payload: { 
      user: data.results[0], 
     }, 
     }) 
    })

現在你應該可以調試。

您可以參考JavaScript promise resolving with setTimeout爲更多的理解=>和功能（）{}

來源

2017-10-11 12:45:25

Chrome開發工具中的調試技巧

回答

相關問題