简单调试技能分享

期望效果

React前端,要显示一个图标和一段文字

错误重现

原本希望展示图标的位置展示成了“[object Object]”


错误示例

调试方式

  1. 右键点击出错位置,点击“查看”;


    Chrome截图
  2. 查看元素对应位置,html元素实际值;


    调试器截图
  3. 返回到代码层面,查找对应的代码位置;


    代码

错误原因

这个错误的原因其实是很明显的,发生了类型转换,把img对象转化为了string

结束语

这个错误其实不用这么复杂的调试过程,这个调试过程只是展示一个调试的方法,我更愿意用这个方法去做样式方面的调试,定位元素,查看样式。
展示的这个错误实际就是基本语法层面的错误。

你可能感兴趣的:(简单调试技能分享)