动画幻灯片TAB使用react

Question

我在做一个简单的标签:https://codesandbox.io/s/crazy-hill-fo60bu

逻辑非常简单，只需根据状态添加和删除类

<div className={`selector ${tab === "two" ? "right" : "left"}`}></div>

但是我怎么可能把它变成这样呢?https://codepen.io/Kapilnemo/pen/pbEbQy

选择的栏有一个"滑动"动画?

Answer 1

在codepen的第57和59行:

-webkit-transition: margin 0.5s ease;

transition: margin 0.5s ease;

这些行正在创建"slide"动画。