zyc
ffe92f7b15
- web/: React + Vite + TypeScript 前端 - backend/: Django + DRF + SimpleJWT 后端 - prototype/: HTML 设计原型 - docs/: PRD 和设计评审文档 - test: 单元测试 + E2E 极限测试
31 lines
708 B
TypeScript
31 lines
708 B
TypeScript
import { useEffect, useState, useCallback } from 'react';
|
|
import styles from './Toast.module.css';
|
|
|
|
let showToastFn: ((msg: string) => void) | null = null;
|
|
|
|
export function showToast(msg: string) {
|
|
showToastFn?.(msg);
|
|
}
|
|
|
|
export function Toast() {
|
|
const [visible, setVisible] = useState(false);
|
|
const [message, setMessage] = useState('');
|
|
|
|
const show = useCallback((msg: string) => {
|
|
setMessage(msg);
|
|
setVisible(true);
|
|
setTimeout(() => setVisible(false), 2000);
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
showToastFn = show;
|
|
return () => { showToastFn = null; };
|
|
}, [show]);
|
|
|
|
return (
|
|
<div className={`${styles.toast} ${visible ? styles.show : ''}`}>
|
|
{message}
|
|
</div>
|
|
);
|
|
}
|