[React] React 中动画的问题

我是 React 菜鸟，帮我看一下这个代码：

// ...
const [show,setShow]=useState(false)

const showFn=()=>{
	setShow(!show)
}

//...
<div style={{left:show?'0px':'100px'}}></div>
//...

这段代码中，根据 show 的值修改这个定位元素的 left ，并且切换的时候这个元素是有过渡效果的，但是因为状态改变导致整个组件重新渲染，那么这个过渡效果就失效了。 要如何解决？