From 8d75167f1b5e58459c558cff0df3ac83969b5b6d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E6=99=A8?= Date: Mon, 30 Sep 2019 17:32:21 +0800 Subject: [PATCH] =?UTF-8?q?fix:=E5=A2=9E=E5=8A=A0=E9=AB=98=E6=95=88?= =?UTF-8?q?=E5=BC=80=E5=8F=91=E6=8A=80=E5=B7=A7snippet=E4=B8=AD=E7=9A=84co?= =?UTF-8?q?nsole.log=E8=B7=9F=E6=96=AD=E7=82=B9=E5=90=8C=E6=AD=A5=E5=8A=9F?= =?UTF-8?q?=E8=83=BD=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/snippet.md | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/docs/snippet.md b/docs/snippet.md index ada198860..51ffc2c61 100644 --- a/docs/snippet.md +++ b/docs/snippet.md @@ -125,6 +125,13 @@ uni.showToast({ 正确打开调试窗口后，显示如下： ![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-window.png) + +#### console.log打日志 +console.log()是我们日常开发最常用的调试方法，HBuilderX中当然也不能少。根据上一步，启动完成debug窗口后，调用console.log()方法就可以看到打印的内容了。如下图： + +![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/debug-console.jpg) + +App端也提供真机运行的console.log日志输出，运行到真机或模拟器时，不用点debug按钮，操作手机，会在HBuilderX的控制台直接输出日志。 #### 调试页面 在调试窗口控制台的 Sources （图中指示1） 栏，可以给 js 打断点调试。 @@ -136,6 +143,12 @@ uni.showToast({ 之后，在设备上进行操作，进入断点位置，可以方便我们跟踪调试代码。 ![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-breakpoint.png) + +#### 断点同步 +HBuilderX还有一个强大的功能，那就是可以直接在编辑器中打断点，断点会自动同步到调试工具中。 +操作步骤：只需要在需要打断点打代码部分，右击，就会出来同步断点到调试器，然后点击就好了。下面就是演示图： + +![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/debug-console-gif.gif) Tip - debug仅支持自定义组件模式。如果是非自定义组件模式，请在manifest里配置选为自定义组件模式。非自定义组件模式即将停止支持，[详见](https://ask.dcloud.net.cn/article/36385) -- GitLab