React长列表使用onMouseEnter和onMouseLeave事件发生抖动常用解决方法

React长列表开发中,经常会用到onMouseEnteronMouseLeave事件,控制一些元素显隐。

发生抖动时,一般有两种方法:目标元素添加父容器(div)和检查目标元素内是否有超出容器范围的子元素。

添加div父容器,常用于处理input等交互类元素。

如果超出容器范围的子元素,最好设计移动到内部或扩大容器范围。

react_logo

具体原理没去仔细深究,反正遇到抖动问题,建议向这两个方向尝试解决。

(版权归cpury.com所有,转载请注明出处。)