在不中断程序情况下,查阅相关数据 - 浏览器logpoint

143 阅读1分钟

操作步骤

打开 开发者工具

操作一:使用 F12

操作二:鼠标右击,选择”检查“

打开 Sources

image.png

打开 指定文件 element-ui.common.js

image.png

image.png

查询方法、参数

使用 ctrl+f 调出搜索框,输入需查询的 方法名称、参数名称……

image.png

新增日志点

于行号处,右击鼠标,选择 Add logpoint...

image.png

输入所需打印的内容

image.png

查看效果

返回 Console操作栏,执行对应操作,即可查看到相关内容

image.png

编辑日志点

于已打日志点处,右击鼠标,选择 Edit breakpoint... 即可实现编辑

image.png

补充内容

差异点:

  • 相较于 breakpoint,其不会中断程序的运行
  • 相较于直接修改源代码,其不会有污染源代码的潜在风险

选择指定文件,而非使用 shift+ctrl+f 全局搜索的原因

  • 全局搜索,无法查询到 element-ui.common.js 内部内容,具体原因暂未得知

    image.png

  • 由上图可知,仅查询到 chunk-vendors.js 文件内部内容