vue开发项目——如何打断点进行调试

在 Vue.js 开发项目中，如果你想在 JavaScript 代码中设置断点以便于调试，有几种方法可以实现。

以下是常用的几种方式：

一、使用浏览器的开发者工具

现代浏览器（如 Chrome、Firefox）都内置了强大的开发者工具，其中就包括了调试 JavaScript 的功能。

• 打开开发者工具：通常可以通过按 F12 或者右键点击页面元素选择“检查”来打开。

• 找到 Sources 面板：在开发者工具中，找到 Sources（源代码）面板。这个面板允许你浏览加载到浏览器中的所有脚本文件。

• 定位到你的代码：在 Sources 面板中，找到你的 Vue 组件或相关的 JavaScript 文件。

• 设置断点：点击行号旁边的空间可以设置一个断点。当程序执行到这一行时，会自动暂停，允许你查看当前状态，例如变量值、调用栈等。

二、使用 debugger 关键字

你也可以直接在代码中使用 debugger; 语句来设置断点。

当浏览器执行到这行代码时，如果开发者工具是开启状态并且选中了相应的脚本文件，那么它将会在这里暂停。

methods: {