我有一個基于用戶操作顯示的警報組件：export default function Alert({text, type, hideable = true, stick = true}) {    const [hide, setHide] = useState(false);    const [id, setId] = useState(makeId(5));    const alertEl = (        <div key={id} id={id} className={"fade alert alert-" + type} role="alert">            {hideable                ? <span className="icon-close close" onClick={e => fadeOut()}> </span>                : ''            }            {text}        </div>    );    function fadeOut() {        document.getElementById(id).classList.add('fade-out');        window.setTimeout(() => {            setHide(true);        }, 500)    }    useEffect(() => {        if (!stick) {            window.setTimeout(() => fadeOut(), 3000);        }    }, [])    if (hide) return '';    return alertEl;}它是這樣使用的：setResponseAlert(<Alert     text="Please check the field errors and try again."     type="danger" stick={false} hideable={false}/>)問題是實例化 Alert 組件仍然返回舊組件。Alert 組件消失后如何實現移除？