javascript - 如何在取消选择前一个元素的同时向新元素添加“选择”样式？

Question

有两个窗口。一个负责显示数据，第二个负责处理数据（删除、更改、添加）

const [active, setActive] = React.useState(null);    
..............

 <FirstWindow active = {active}  setActive = {setActive}></FirstWindow>         
 <SecondWindow active = {active}  setActive = {setActive}></SecondWindow>

在第一个窗口内，实现了添加被单击元素的“选择”。（只能选择一个元素，点击另一个，选择从过去消失，添加到新元素）

const FirstWindow = ({items, active, setActive}) =>{
    const dispatch = useDispatch();
    function getElem(i, item) {          
        setActive(i);        
        dispatch(userInfo(item));     
    }

    
    return(
        <div className = "container">
            {
                items.items.map((item,i) =>{
                    return <FirstWindowItems
                     item = {item}
                     isActive={active===i}
                     onClick={()=>getElem(i,item)}
                     key={item.id}
                     
                     ></FirstWindowItems>
                })
            }            
        </div>
    )
}

class SecondWindow extends React.Component{
    constructor(props, active, setActive){
        super(props);
        this.active = active;
        this.setActive = setActive;
    }

ubmitHandler = e => {
        e.preventDefault();        

        const newUser = {
            id: Date.now().toString(),
            FIO: "name",
            position:"Position",
            birthDay: "date",
            sex: true,
            fired: false
        };        
        this.props.createNewUser(newUser);
        this.props.userInfo(newUser);
        this.setActive(1); //here
    }

第二个窗口有一个用于添加新项目的按钮。单击此按钮时，需要向该元素添加选择样式并取消选择先前的选择。怎么做？我正在使用redux，也许它可以通过它来实现？