无法在Chrome开发人员工具中设置断点

debugcn 发表于 Dev

法博·吉亚斯（Farbod Ghiasi）

当我使用chrome开发人员工具设置断点时，不会将其设置在我要设置的行中。它将其更改为另一行。为什么会这样？如果要在所需行中设置断点，该怎么办？

这是视频：https : //drive.google.com/file/d/0B7NuLgKMVzkgUHhaclM0YW1BSEU/view?usp=sharing

吉迪恩·比泽（Gideon Pyzer）

调试器允许您在语句上添加断点。这可以通过单击语句开始处的行号来实现。您不能在其中的表达式上添加断点。

例子

以下代码是视频中Angular代码的模型：

$stateProvider.state("key1", {
    url: "url1",
    controller: "controller1",
    templateUrl: "templateUrl1"
}).state("key2", {
    url: "url2",
    controller: "controller2",
    templateUrl: "templateUrl2"
});

从第1行开始，到第9行，只有一条语句。您可能正在调用两个链接在一起的函数，但是它们是一条语句。

注入调试器/跟踪语句

您可以通过debugger在state函数中添加一条语句来解决此限制，以便在每次链接函数调用时都会中断该语句。您可以在控制台/代码段中运行类似的内容：

var oldState = $stateProvider.state;

$stateProvider.state = function() {
    debugger;
    return oldState.apply(this, arguments);
}

这将保存对旧函数定义的引用，然后使用该debugger语句覆盖当前函数。如果您不关心真正的功能，则可以在此结束。但是，要继续正常执行，我们可以使用调用origin函数apply，该函数指定要传递的上下文和参数。您可以在此处阅读详细说明。

现在，这将在每次state执行时中断。如果您只是想为某个特定案例而中断怎么办？好吧，您可以按如下所示在语句上添加条件断点debugger：

现在，仅当代码key为'key2'时，代码才会中断。

调试器语句可能会干扰您的执行流程，因此您可以将其替换为console.log语句或其他任何语句。在这种情况下，可以省略条件逻辑。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。

编辑于2021-06-27

我来说两句

0条评论

登录后参与评论

来自分类Dev