怎样调试react
所需工具:chrome浏览器、React Developer Tools 插件
1、安装React Developer Tools 插件
下载插件,在chrome里进行安装即可。
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反应。这表明你的根反应组件在页面渲染,以及他们最终渲染组件。
2、运行react项目,在浏览器打开。
(1) 按下f12打开调试面板-选择react-进入组件
(2) F8继续调试;
(3) F11进入Javascript中的函数体调试;
(4) F10 进入下一行;
f10是执行下一行js代码
f11是进入当前行方法
f8是让代码继续运行
更多React相关技术文章,请访问React答疑栏目进行学习!
以上就是怎样调试react的详细内容,更多请关注万博manbetx平台中文网其它相关文章!