我想撰寫一個每秒閃爍的閃爍文本，使用 React 拋出 CSS 屬性（可見性），我想以這種確切的方法實作它，這是我想要做的：
錯在哪里？我也試過 setTimeout 但效果不佳。
import { useState, useEffect } from "react";
function Blink(props) {
const [state, setState] = useState("hidden");
useEffect(() => {
setInterval(() => {
setState("visible");
console.log("changed");
}, 1000);
return () => clearInterval();
}, [state]);
return <span style={{ visibility: state }}>{props.children}</span>;
}
function App() {
return <Blink>Hello World!</Blink>;
}
uj5u.com熱心網友回復：
您的 setInterval 不會在“可見”和“隱藏”之間交替狀態。它所做的一切都是一遍又一遍地將狀態設定為“可見”。您需要考慮當前狀態。我認為，最簡單的方法是將其設為布林值 ( useState(false))，然后在 setInterval 中使用它setState(!state)。
然后您需要做的就是將樣式更改為{{ visibility: state ? 'hidden' : 'visible' }}.
uj5u.com熱心網友回復：
您錯過了清除狀態（切換可見/隱藏）。我認為你應該嘗試這樣的事情：
setState(state == 'visible' ? 'hidden' : 'visible')
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/396419.html
標籤：javascript css 反应
上一篇：使用VanillaCSS和樣式化組件回應組件渲染轉換
下一篇：懸停CSS時背景顏色不會改變