第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

如何定期更改狀態(tài)值?

如何定期更改狀態(tài)值?

滄海一幻覺(jué) 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>  );}問(wèn)題:上面的定時(shí)函數(shù)周期性的改變狀態(tài),但是4秒后圖像會(huì)不受控制的改變問(wèn)題:如何每 1 秒更改一次狀態(tài)?所需圖像的重復(fù)。image_3/image_2 = 表示圖像位置
查看完整描述

1 回答

?
慕容森

TA貢獻(xiàn)1853條經(jīng)驗(yàn) 獲得超18個(gè)贊

在 中保留當(dāng)前圖像的索引state,然后定義一種每秒遞增它的方法。調(diào)用該方法useEffect以在頁(yè)面加載時(shí)啟動(dòng),然后img通過(guò)索引數(shù)組用正確的圖像填充。


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>

       <img src={images[imageIndex]} alt={images[imageIndex]}/>

    </div>

  );

}


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

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.4/umd/react.production.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.4/umd/react-dom.production.min.js"></script>

<div id="root"></div>


查看完整回答
反對(duì) 回復(fù) 2022-11-27
  • 1 回答
  • 0 關(guān)注
  • 88 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)