有什么react调试神器?

在react中可以使用调试工具React Developer Tools、Redux DevTools、React Native Debugger进行调试。下面本篇文章就来给大家介绍一下,有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

React Developer Tools

React Developer Tools是开发的React必备的开发者工具扩展。可以在chrome开发者工具中得到一个名为React的新标签,检查React组件层次结构,在页面上显示React组件。

React Developer Tools是一款由facebook开发的有用的Chrome 浏览器扩展,可以通过 Chrome Web存储获取。使用 Chrome Devtools 进行调试时,可以查看应用程序的 React 组件分层结构,而不是更加神秘的浏览器 DOM 表示。

添加react developer tools到chrome,是对chrome开发工具的React调试工具。React的开发工具是开源Chrome DevTools延伸反应的JavaScript库。它允许你检查React在Chrome开发者工具组件的层次结构(原名WebKit Web Inspector)。你会得到新的标签要求在你的Chrome DevTools反应。这表明你的根反应组件在页面渲染,以及他们最终渲染组件。

Redux DevTools

Redux DevTools是Chrome浏览器中的一款调试插件,它可以用于调试redux中的状态更改,我们可以清晰的看到当前store仓库中的state是怎么样的,在可视化工具的左边,我们还可以看到触发的action的变化。

React Native Debugger

React-Native-Debugger 是在官方 Remote Debugger 调试工具的基础上,集成了 React Inspector 以及 Redux DevTools 的调试工具。

可以用来代替之前一直使用的 Chrome 远程调试,比较方便地查看元素布局,和Redux管理的状态

更多React相关技术文章,请访问 React答疑 栏目进行学习!

以上就是有什么react调试神器?的详细内容,更多请关注易知道|edz.cc其它相关文章!

推荐阅读