已解決430363個問題，去搜搜看，總會有你想問的

如何定期更改狀態值？

首頁猿問如何定期更改狀態值？

如何定期更改狀態值？

JavaScript

滄海一幻覺 2022-11-27 16:54:10

function Carousal() { const [image, setImage] = useState(image_1); return ( <div> {setInterval(() => {setImage(image_1)}, 1000)} {setInterval(() => {setImage(image_2)}, 2500)} {setInterval(() => {setImage(image_3)}, 3500)} {Note : above functions are for state change} <img src={image} /> </div> );}問題：上面的定時函數周期性的改變狀態，但是4秒后圖像會不受控制的改變問題：如何每 1 秒更改一次狀態？所需圖像的重復。image_3/image_2 = 表示圖像位置

查看完整描述

1 回答

慕容森

TA貢獻1853條經驗獲得超18個贊

在中保留當前圖像的索引state，然后定義一種每秒遞增它的方法。調用該方法useEffect以在頁面加載時啟動，然后img通過索引數組用正確的圖像填充。

function Carousel() {

const [imageIndex, setImageIndex] = React.useState(0);

const images = ["image_1", "image_2", "image_3"];

const nextImage = () => {

setImageIndex(prev => (prev + 1) % images.length)

setTimeout(nextImage, 1000)

}

React.useEffect(nextImage, [])

return (

<div>

</div>

);

}

ReactDOM.render( <Carousel /> , document.getElementById("root"));

反對回復 2022-11-27

1 回答
0 關注
82 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何定期更改狀態值？

如何定期更改狀態值？

1 回答

添加回答

如何定期更改狀態值？

如何定期更改狀態值？