本文介绍了Source选项卡的构成和功能，包括源码区域的断点设置，调试信息中的变量监控，以及如何通过断点进行代码调试。通过案例分析了如何解决点击事件无效的问题，涉及到函数调用、变量检查和代码修改，强调了熟练使用这些工具能帮助开发者快速定位和修复代码问题。
简介
Source选项卡，该说不说意味着你的头发量，会使用的人赚的钱可以买自己喜欢的东西，不会的人，只能用来去植发了😂
该项选卡可以帮助你快速定位问题，观察程序运行的情况
组成
接下来我们看下面这张图
source选项卡主要由以上这个区域组成，左侧是你页面加载所需的整个资源。中间部分为源码区域，最右侧就是调试信息了。
- 源码区域
- 最左侧的序号部分，每一个序号都可以点击，点击时会在这一行加一个断点信息，再次点击时，就会取消改行的断点。
- 断点：就是当代码运行到该行时，则会停止运行，需要你进行操作才继续执行。
- 调试信息区域
- breakpoints这个选项显示源码区域打断点的信息
- Scope 区域 ，这个区域包含当前所有可用的局部变量，全局变量以及闭包的变量，并且实时更新。
- Watch 学过vue的小伙伴，应该很容易理解，就是一个监听器，监听你想看的值或者是表达式，并且是实时更新的
- 其他几个区域小编还没怎没用过。
最低0.47元/天 解锁文章
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
