React调试工具

一、安装ReactDeveloperTools插件

  • 在Chrome浏览器中，点击右上方的三个小点的菜单图标——更多工具——扩展程序。
  • 在新打开的扩展程序页面的左上方的三个横线的菜单图标——打开Chrome应用商店，搜索安装插件即可
    温馨提示：上面操作需要科学上网，不能翻墙可以使用下面方法：
  1. 安装谷歌访问助手插件，可以访问Chrome应用商店
  2. 离线安装ReactDeveloperTools插件

离线包：谷歌访问助手
                ReactDeveloperTools

二、ReactDeveloperTools的使用

  • 打开扩展程序页面，点击该插件的详细信息按钮，将允许访问文件网址一项打开
  • 重启浏览器
  • 按F12打开开发者工具，会发现选项卡中出现了React选项
RDT.JPG

三、ReactDeveloperTools的功能

  • 查看state和props
stateAndprops.JPG
  • 当数据改变时，高亮
highlightUpdate.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • 2018 iOS 三方库(仅供方面查看)
    用到的组件 1、通过CocoaPods安装 2、第三方类库安装 3、第三方服务 友盟社会化分享组件 友盟用户反馈 ...
    SunnyLeong阅读 14,659评论 1赞 180
  • 13/14 变故/宽心
    那次爬山活动之后，我和他的关系就是彻底公布于世了 中外方老师，校长也都看出来了，惊讶于我们俩上了山...
    610VIX阅读 180评论 0赞 0
  • 假如Jack和rose的爱情开花结果会怎么样？
    假如Jack和rose的爱情开花结果会怎么样？ 在今天这个距离泰坦尼克号公映整整20周年的日子里，这个话题我觉得又...
    预言少女阅读 816评论 0赞 0
  • #生活#记日子2017.3.8
    女神们，节日快乐！ 今天 日子 很巧 不错 难得一遇 女神节！ 谢谢，开心！ 今晚 与老妈、老姐通电话，祝她俩节日...
    轩玄義阅读 52评论 0赞 0
  • 『怕不是个假冬至』
    估计ooc 想试一次在这边发局路的bl作品，不认识cp的亲们直接当新cp看好了。 其实本来的东西都在百度贴吧，如果...
    席俍先生阅读 476评论 1赞 2