react-native 学习(二)
上一节讲到了 react-native的开发环境的配置,,这一节我门具体讲讲怎么看样式,怎么调试
看样式的话 有一个 神奇 react-native-developer tools(个人推荐,可选择性的选择用还是不用)
本包子 喜欢用真机调试,,,我一般拿android机器调试,,因为react-native在样式方面 是IOS的亲妈,是android的后妈。没毛病~
1.调试的话,如果是simulator模拟器的话,一般是command + D 弹出菜单选项,里面有一个 inscpect 这个是检查样式的。
如果是真机的话,你就使劲晃动你的手机。就会出来菜单选项了
2.有一个 remote debugger 这个将会自动打开 本地电脑的 谷歌浏览器。这个 不能看样式,但是能看到 发送请求的log日志 在console 控制台
你也可以去打断点。这一整个项目做下来,我发现没有什么bug是打断点解决不了的。。。。。
但是 有时候,我们想去看看我们发送的请求可咋整,因为network里面没有请求的日志,比较,react-native 不是H5.。。。。
这个时候我们可以用抓包工具,charlse 茶壶,这个响当当的抓包工具。这个 抓包工具的用法请自行百度
3.如果你在的电脑上更改了什么东西,想要 实时更新在你的手机上。。 你会发现 有一个hot reloading 没错 ,点击他。。然后,将你,当前电脑连接的ip 输入进去。
端口默认是8081.。前提是你npm start 的时候没有更改过端口号
然后 重新 在 reload 你的页面。。。一般一切顺利的话,,,当你 在 页面上 改什么东西的话,,就会在你的手机上显示 hot reloading
BUT 大部分的时候不会这么顺利。。。可能出现 报错。。。一般其实 我们就照着 报错上面的提醒做就行(这一点蛮好的,报错的解决方法和原因都给你写里面了)
一般我的报错 解决方法就是 adb reverse tcp:8081 tcp:8081 这个命令行。。然后 仔重新 运行一下环境就好了。记住啊,这个必须是 手机和 电脑在同一个局域网下/
总而言之,这个 调试方法就是 command +D 或者 摇一摇。。。。
下一节我们讲讲react-native中的样式写法和兼容问题
react-native 学习(二)的更多相关文章
- React Native学习(二)之View
React Native组件解析(二)之View 0.JSX React的核心机制之一就是虚拟DOM:可以在内存中创建的虚拟DOM元素.React利用虚拟DOM来减少对实际DOM的操作从而提升性能. ...
- React Native 学习笔记--进阶(二)--动画
React Native 进阶(二)–动画 动画 流畅.有意义的动画对于移动应用用户体验来说是非常必要的.我们可以联合使用两个互补的系统:用于全局的布局动画LayoutAnimation,和用于创建更 ...
- React Native 学习-01
React Native 学习 (学习版本 0.39) 一.环境配置 二.IDE选择 webstorm 1.webstorm配置 ①.首先是可以选择使用汉化包汉化.eu68 ②.安装插件和外部库. 由 ...
- react native 学习一(环境搭配和常见错误的解决)
react native 学习一(环境搭配) 首页,按照http://reactnative.cn/docs/0.30/getting-started.html#content上的介绍,下载安装pyt ...
- React Native 学习资料
React Native 学习资料 学习资料 网址 React Native中文网 https://reactnative.cn/
- React Native 学习(三)之 FlexBox 布局
React Native 学习(三)之 FlexBox 布局
- React Native学习(二)—— 开始一个项目
本文基于React Native 0.52 一.创建一个项目 1.初始化一个RN项目 react-native init RNDemo 2.连接一个设备或是打开模拟器 可以通过 adb devices ...
- iOS、swift、React Native学习常用的社区、论坛
<!----iOS> <!----Swift>*IOS开发常用社区:http://code4app.com/ *IOS开发常用社区:http://www.cocoachina. ...
- react native学习资料
一:基础学习: react-native中文文档(react native中文网,人工翻译,官网完全同步)http://react-native.cn/docs/getting-started.htm ...
- react native 学习资料整理
入门教程 深入浅出 React Native:使用 JavaScript 构建原生应用 http://www.appcoda.com/react-native-introduction/ 中文版 h ...
随机推荐
- Android 开发之Android 应用程序如何调用支付宝接口
1.到支付宝官网,下载支付宝集成开发包 由于android设备一般用的都是无线支付,所以我们申请的就是支付宝无线快捷支付接口.下面是申请的地址以及下载接口开发包的网址:https://b.alipay ...
- 基于jquery仿360网站图片选项卡切换代码
今天给大家分享一款基于jquery仿360网站图片选项卡切换代码.这款实例适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预 ...
- scala,spark练习题提高
1.求每家公司有哪些产品 val arr3 = List("Apache" -> "Spark", "Apache" -> &q ...
- HTML5标准最终来了,看什么书学习最好??????
近期看了一本书<HTML5网页开发实例具体解释>,是大众点评的攻城狮写的,认为非常有收获.看样子眼下大多数的国内网页都支持HTML5了,全栈project师是不是必须得会HTML5? 有兴 ...
- loadOnStartup = 1
在servlet的配置当中,<load-on-startup>5</load-on-startup>的含义是:标记容器是否在启动的时候就加载这个servlet.当值为0或者大于 ...
- JobTracker作业启动过程分析
转自:http://blog.csdn.net/androidlushangderen/article/details/41356521 在Hadoop中,启动作业运行的方式有很多,可以用命令行格式把 ...
- Differential Geometry之第六章平面曲线的整体性质
第六章.平面曲线的整体性质 1.平面的闭曲线 1.1.切线的旋转指数定理 1.2.等周不等式与圆的几何特性 ,其中 2.平面的凸曲线 支撑函数: 2.1.Minkowski问题 2.2.四顶点定理
- ubuntu vnc安装
VNC(Virtual Network Computing),为一种使用RFB协议的屏幕画面分享及远程操作软件.此软件借由网络,可发送键盘与鼠标的动作及即时的屏幕画面. 1. 安装vnc服务器 sud ...
- 去掉if
修改前 namespace CleanCSharp.Methods.Dirty { class BooleanSwitchingArgumentsExample { p ...
- c#方法生成mysql if方法(算工作日)
public static string retunSQl(string s,string e){ return @"IF ( "+s+ ">" +e+ ...