如何在ReactJS中每隔5秒顯示一則訊息

Question

我有一個訊息數組，我想在我的React頁面的Header元件中顯示該數組中的每個訊息。

const array = ['a', 'b', 'c', 'd'];

我想在一個

標籤中顯示每個訊息，同時我需要一個清除超時函數，以防止每次點擊後時間加快，並且它應該在5秒後切換到下一則訊息，請有人能幫幫我嗎。

Answer 1

對於對陣列的簡單循環，你可以這樣做：

const array = ['a', 'b', 'c', 'd'];

counter = 0;
const interval = setInterval(() => {
  console.log(array[counter % array.length]); //例如 "a", "b"
  //你可以对返回值做任何操作（将其放入a标签中）
  counter++;
}, 5000);

要清除間隔，你可以這樣做：

clearInterval(interval);

我不確定你想在點擊事件中做什麼。請提供進一步的資訊。