仅更新子组件而不重新渲染父组件

Question

有没有一种方法可以只重新渲染孩子，而不能重新渲染父母？我想基于父级上的鼠标交互来更改子级样式。代码示例here。儿童应在鼠标进入时隐藏并在鼠标离开时显示。我不想使用setState，因为它会重新渲染父级并增加鼠标事件。 setState示例here。

<div
  onMouseEnter={() => {
    showChild = false
  }} 
  onMouseLeave={() => {
    showChild = true
  }}
>
  <p>Parent</p>
  <Child show={showChild} />
</div>