problem description

render ()
{

  return (
    <div onClick={()=>{alert(1)}}>
    <div onClick={()=>{alert(2)}}>Hello</div>
    <NavLinkBar onClick={()=>{alert(3)}} data={navList}> 
    </NavLinkBar>
    </div>     
    )

}

No matter how much you click, you can only start from the outermost div alert (1). Is it my bug here, or is it designed by react itself?

here is TabBar with antd-mobile