如何在React.js中更改带有时间范围的句子?例如,我有一个10秒的间隔,它以一个句子开始,在第2秒它变成另一个句子,在第4秒它回到最初的句子例如,我有一个10秒的间隔,它以一个句子开始,在第2秒它变成另一个句子,在第4秒它回到最初的句子
hrysbysz1#
你需要这样的东西:
const [sentence, setSentence] = useState("First sentence"); const intervalRef = useRef(null); useEffect(() => { intervalRef.current = setInterval(() => { if (sentence === "First sentence") { setSentence("Second sentence"); } else { setSentence("First sentence"); } }, 2000); // Clear the interval setTimeout(() => { clearInterval(intervalRef.current); }, 11000); // Setting 11 because it would stop before the final change if it was 10 return () => clearInterval(intervalRef.current); }, [sentence]); return <div>{sentence}</div>;
这将每2秒改变一次句子,总共10秒。使用ref就像一个计数器。
1条答案
按热度按时间hrysbysz1#
你需要这样的东西:
这将每2秒改变一次句子,总共10秒。使用ref就像一个计数器。