×

React Sight React组件层次可视化工具

消耗积分:0 | 格式:zip | 大小:6.10 MB | 2022-05-18

刘桂兰

分享资料个

授权协议 MIT
开发语言 JavaScript HTML/CSS
操作系统 跨平台
软件类型 开源软件

软件简介

React Sight 是 React 应用的组件层次树的实时视图,以 Chrome 插件形式发布,支持 React Router 和 Redux,现在支持Firefox。

设置 | 从 Chrome 商店安装

  1. 确保您已将React Dev Tools添加到 Chrome。
  2. 从 Chrome 网上商店安装React Sight
  3. 如果您正在运行本地文件 URL,请确保在 React Dev Tools 和 React Sight 的扩展设置中启用“允许访问文件 URL”
  4. 运行你的 React 应用程序,或者打开任何运行 React 的网站!
  5. 打开 Chrome 开发者工具 (cmd+opt+j) -> React Sight 面板

用法

将鼠标悬停在节点上,在侧面板中查看它们的状态和道具。

使用内置过滤器隐藏 DOM 元素、Redux 组件和路由器组件,可以只关注自己编写的组件

通过双击放大,通过 shift + 双击缩小(鼠标滚轮缩放即将推出!)

 

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉

评论(0)
发评论

下载排行榜

全部0条评论

快来发表一下你的评论吧 !