Some instances of a ReactJS component won't update

Question

I'm developing a VOD app for TV and I'm having an issue with updating an element inside of a slide component. Basically, when a costumer focuses on any of the slides, it calls on a method that stores it's ID on state and then, one of their children checks if the stored state equals the selected item state and if so, it renders. On focusout, it sets the state to null. The weird thing is in most instances of the component this works, but some of them (and always the same instances) won't update.

PSEUDOCODE:

handleFocus(id){setFocused(id)} // Sets the id to state
handlefocusout(){setFocused(null)} // resets state
{isFocused === item.id && <div/>} // checks if state === id and renders

Me and my TL are at a loss as of why it won't work on some of the instances, and unless I'm mistaken, it's always on the same ones. Mind you, the instances' content come all from the same JSON response and are all the same in content (hence instance).

Answer 1

我从来没有发现为什么 EventListener 不能正确触发，但我最终删除了它并将 React 的事件处理程序添加到元素中，它开始工作。