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

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

使用 React hooks 每 X 秒顯示一個(gè)不同的值

使用 React hooks 每 X 秒顯示一個(gè)不同的值

開心每一天1111 2023-03-03 18:56:25
所以基本上感謝 Mateo 的指點(diǎn)，我能夠使用這個(gè)腳本更新項(xiàng)目元數(shù)據(jù)：function alex_test_function() { // get existing oauth token var theAccessTkn = ScriptApp.getOAuthToken(); // get existing project metadata var response =  UrlFetchApp.fetch('https://compute.googleapis.com/compute/v1/projects/myProject', {   headers: {     Authorization: 'Bearer ' + theAccessTkn   } }); var data = JSON.parse(response.getContentText()); var metadata = data.commonInstanceMetadata fingerprint = metadata.fingerprint; new_metadata_items = metadata.items;// update metadata var timestamp = new Date().getTime() setMetaKey(new_metadata_items, Session.getActiveUser().getEmail().split("@")[0], timestamp) var formData = {  'fingerprint': fingerprint,  'items': new_metadata_items  }; var postresponse = UrlFetchApp.fetch("https://compute.googleapis.com/compute/v1/projects/myProject/setCommonInstanceMetadata", {  'method' : 'post',  'contentType': 'application/json',  'payload' : JSON.stringify(formData),  'headers': {    Authorization: 'Bearer ' + theAccessTkn   }  });}function setMetaKey(metadata, key, value){  // Function to add metadata or update if exists  for (var i = 0; i < metadata.length; i++) {    if (metadata[i].key === key) {      metadata[i].value = value;      return;    }  }  metadata.push({key:key, value:value});}一些陷阱，我們需要將 OAuth 范圍設(shè)置為 AppScript 清單{  "timeZone": "America/New_York",  "dependencies": {  },  "exceptionLogging": "STACKDRIVER",  "runtimeVersion": "V8",  "oauthScopes": [    "https://www.googleapis.com/auth/userinfo.email",     "https://www.googleapis.com/auth/compute",     "https://www.googleapis.com/auth/script.external_request"]}并且運(yùn)行腳本的用戶需要具有編輯 GCP 項(xiàng)目中的項(xiàng)目元數(shù)據(jù)的權(quán)限。我沒有對(duì)范圍進(jìn)行很多實(shí)驗(yàn)，可以用更窄的范圍而不是https://www.googleapis.com/auth/compute來執(zhí)行腳本我想顯示“Orange”2 秒，“Kiwi”或 1 秒，“Mango”3 秒。這是我的嘗試，它顯示靜止的“橙色：2000”，而我希望它根據(jù)指定的秒數(shù)翻轉(zhuǎn)。我錯(cuò)過了什么？
查看完整描述

3 回答

?
月關(guān)寶盒

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

讓您的組件在索引更改時(shí)由其狀態(tài)驅(qū)動(dòng)，它會(huì)觸發(fā)更新 currentFruit 狀態(tài)的 useEffect 掛鉤，currentFruit 更改會(huì)觸發(fā)另一個(gè)更新索引的 useEffect 等等，然后只需使用 like setTimeout：


const IntervalExample = () => {

    const fruits = [

        {id: 1, name: "Orange", duration: 2000},

        {id: 2, name: "Kiwi", duration: 1000},

        {id: 3, name: "Mango", duration: 3000},

    ]


    const [index, setIndex] = useState(0);

    const [currentFruit, setCurrentFruit] = useState(fruits[index]);


   

    

    useEffect(() => {

        setCurrentFruit(fruits[index])

    }, [index])


    useEffect(() => {

        const interval = setTimeout(() => {

            setIndex(index === fruits.length - 1 ? 0 : index + 1)       

        }, currentFruit.duration);

    }, [currentFruit])


    return (

        <div className="App">

            <header className="App-header">

                {currentFruit.name}: {currentFruit.duration}

            </header>

        </div>

    );

};


查看完整回答
反對(duì) 回復(fù) 2023-03-03
?
慕虎7371278

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

UseEffect 只被調(diào)用一次。因此，Const interval將為時(shí)間間隔的函數(shù)調(diào)用初始化一個(gè)閉包。它永遠(yuǎn)不會(huì)改變。關(guān)閉中的索引將始終為 0。


這是我的解決方案，只需使用一種狀態(tài)作為索引：


const IntervalExample = () => {

    const fruits = [

        {id: 1, name: "Orange", duration: 2000},

        {id: 2, name: "Kiwi", duration: 1000},

        {id: 3, name: "Mango", duration: 3000},

    ]


    const [index, setIndex] = useState(0);


    //because fruit depend on index. Dont need a separate state

    const currentFruit = fruits[index];


    const handleIndex = () => {

        setIndex(index === fruits.length - 1 ? 0 : index + 1)

    }


    useEffect(() => {

        //after render current fruit. We new timeout to set next fruit.

        setTimeout(handleIndex, currentFruit.duration);

    }, [index]);


    return (

        <div className="App">

            <header className="App-header">

                {currentFruit.name}: {currentFruit.duration}

            </header>

        </div>

    );

};


查看完整回答
反對(duì) 回復(fù) 2023-03-03
?
慕的地8271018

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

如果你想為每個(gè)水果使用不同的超時(shí)，那setTimeout將是更好的方法。


由于在初始值setInterval被調(diào)用時(shí)會(huì)被設(shè)置為改變顯示水果信息的時(shí)間間隔。useEffect


您的代碼中的問題是在更新index狀態(tài)時(shí)未正確更新。


為了解決這個(gè)問題而不是直接更新值，我使用更新后的狀態(tài)值，如下所示


setIndex((index) => (index === fruits.length - 1 ? 0 : index + 1))

const { useState, useEffect } = React;


const fruits = [

  { id: 1, name: "Orange", duration: 2000 },

  { id: 2, name: "Kiwi", duration: 1000 },

  { id: 3, name: "Mango", duration: 3000 }

];


const IntervalExample = () => {

  const [index, setIndex] = useState(0);

  const [currentFruit, setCurrentFruit] = useState(fruits[0]);


  useEffect(() => {

    const interval = setInterval(() => {

      setIndex((index) => (index === fruits.length - 1 ? 0 : index + 1));

    }, fruits[index].duration);

    return () => clearInterval(interval);

  }, []);


  useEffect(() => {

    setCurrentFruit(fruits[index]);

  }, [index]);


  return (

    <div className="App">

      <header className="App-header">

        {currentFruit.name}: {currentFruit.duration}

      </header>

    </div>

  );

};



ReactDOM.render(

       <IntervalExample />,

       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ù) 2023-03-03
  • 3 回答
  • 0 關(guān)注
  • 202 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

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

 幫助反饋 APP下載

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

 公眾號(hào)

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