在写完RN结构后,希望调取远程数据,但是在手机界面无法看到数据的展示,调试更无从谈起,这时候就需要开启远程调试界面
开启的方法很简单,就是在设置界面,点选第二个选项‘Remote JS Debugging’,这个时候会启动加载,然后在自己的电脑桌面上会打开一个浏览器调试窗口,界面大概是这样的:
React Native JS code runs inside this Chrome tab.
Press Ctrl⇧J to open Developer Tools. Enable Pause On Caught Exceptions for a better debugging experience.
Status: Debugger session #0 active.
获取数据的方式和途径很多,RN在调取第三方数据方法类似ajax异步获取,封装了一个非常好用的方法fetch,用法如下
fetch(url)
.then((res)=>res.json())
.then((json)=>{
console.log( json );//这里在远程调试界面的控制台可以看到自己获取的数据是什么样的格式,方便进一步数据操作
}).catch((err)=>{
console.error(err);
})
我在获取数据的时候,遇到了标题中所说的问题:调试面板打开了,但是却报错,手机界面黄色提示,调试控制台都报了同样的错误,根本没有数据显示
Debugger and device times had drifted by more than 60s. Please correct this by running adb shell "date date +%m%d%H%M%Y.%S" on your debugger machine
命令行调用adb shell,根本不理我,后来又搜了下,可以通过修改win10系统时间来解决这个问题
Deselect Automatic timezone.
Adjust your timezone manually.
Select deselect automatic date & time to set correct time
也就是打开win10的设置界面,设置时间和日期,自动设置时区全部打开(反正时全自动了),然后重新reload一下,数据立即出现在调试页面,同时如果你的调试页面不是单独的页面,还会提示你
Remote debugger is in a background tab which may cause apps to perform slowly. Fix this by foregrounding the tab (or opening it in a separate window).
也就是把标签页单独拉出来就好了,这样debugger效率会高一些