微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

将光标移动到 React 组件时,React DevTools 显示非常大的背景

如何解决将光标移动到 React 组件时,React DevTools 显示非常大的背景

Chrome 版本 87.0.4280.141(官方版本)(x86_64)

React 开发者工具 4.10.1 (12/4/2020)

为 Chrome 浏览器安装了 React Developer Tools 扩展。

  • 打开一个由 React tech 开发的网站(例如 https://react-dev-inspector.zthxxx.me/ 可以用来试一试)
  • 打开 Chrome 菜单 ... => 更多工具 => 开发者工具
  • 如果当前页面加载了 React 组件,请转到“组件”选项卡。
  • 标签页的左上角,有一个带有工具提示的光标按钮:“选择页面中要检查的元素”,单击它,然后将鼠标移动到网页上。
  • 它将显示带有工具提示的 React 组件。 (就像下面的截图)
  • “更多”按钮是一个 HTML 元素“a”,大小为 66px x 40px。

the normal status

但我的问题是,在我们开发的网站上,React inspect 会以非常大的黑色背景显示。就像下面的截图。

  • 这是一个大小为 240px x 52px 的按钮
  • 提示的位置不在组件旁边,而是在屏幕顶部
  • 还有一个非常大的背景

我不确定我们在哪里/什么配置设置不正确。

任何评论和帮助将不胜感激。

my website with problems

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。