在开发javaweb应用的时候,如果遇见一个问题都会调试,debug,在火狐和谷歌浏览器的时候我们也可以使用断点的方式调试js,小程序可以吗?肯定是可以的!小程序的调试也可以在手机端进行远程调试。源码:https://github.com/limingios/wxProgram.git 中的No.4
海港网站制作公司哪家好,找创新互联建站!从网页设计、网站建设、微信开发、APP开发、成都响应式网站建设公司等网站项目制作,到程序开发,运营维护。创新互联建站从2013年成立到现在10年的时间,我们拥有了丰富的建站经验和运维经验,来保证我们的工作的顺利进行。专注于网站建设就选创新互联建站。
登录微信小程序,获取appId,远程调试必须有AppID
新建项目
记住这个必须填入AppID
了解功能按键
>预览:手机可以通过扫描二维码的方式在手机上直接观看小程序
>远程调试:可以在手机上进行操作,并且可以在电脑上弹出对应的控制台,来观察操作的效果,同时在手机和电脑上进行调试。
修改初始化代码
>源码:https://github.com/limingios/wxProgram.git 中的No.4
app.js
//app.js App({ onLaunch: function (options) { console.log("onLaunch") }, onShow: function (options) { console.log("onShow") }, onHide: function () { console.log("onHide") }, onError: function (msg) { console.log("onError") }, globalData: 'I am global data' })
app.json
{ "pages":[ "pages/index/index" ], "window":{ "backgroundTextStyle":"light", "navigationBarBackgroundColor": "#fff", "navigationBarTitleText": "WeChat", "navigationBarTextStyle":"black" } }
index.wxml
{{motto}}
index.js
//index.js //获取应用实例 const app = getApp() Page({ data: { motto: 'Hello World', userInfo: {}, hasUserInfo: false, canIUse: wx.canIUse('button.open-type.getUserInfo') }, onLoad: function () { this.setData({ motto: app.globalData }) } })
打断点,源码中加入debugger
app.js
//app.js App({ onLaunch: function (options) { debugger console.log("onLaunch") }, onShow: function (options) { debugger console.log("onShow") }, onHide: function () { debugger console.log("onHide") }, onError: function (msg) { debugger console.log("onError") }, globalData: 'I am global data' })
编辑工具下的调试
> 开启调试器,可以通过f10单步进行调试
安装itools手机可以实时看到手机上的
>扫描预览的效果
打开手机的调试
重新进入小程序
点击vConsole
这里出发了onHide,上次在工具开发预览的时候并没有触发。.
开启远程调试
>点击开启远程调试,也会生成一个二维码
手机扫一扫,
出现命中断点和远程调试窗口
可以看到类似web调试的一些工具
可以查看远端代码
PS:最后想到了什么老铁,可以查看远端的代码是不是就可以获取到借鉴他的代码了。其实微信早就想到了,不是所有的都可以的。远端调试必须知道他的APPID的,不是说直接看就可以了。
>>原创文章,欢迎转载。转载请注明:转载自IT人故事会,谢谢!
>>原文链接地址:「小程序JAVA实战」 小程序远程调试(九)
售后响应及时
7×24小时客服热线数据备份
更安全、更高效、更稳定价格公道精准
项目经理精准报价不弄虚作假合作无风险
重合同讲信誉,无效全额退款