countdownTimer如何定制化顯示格式

要定制化顯示格式，您可以在CountdownTimer組件中使用自定義樣式和格式化函數來實現。以下是一個示例代碼，演示如何在CountdownTimer組件中自定義顯示格式：

import React, { useState } from 'react';
import CountdownTimer from 'react-countdown-timer';

const formatTime = (time) => {
  const seconds = Math.floor(time / 1000) % 60;
  const minutes = Math.floor(time / (1000 * 60)) % 60;
  const hours = Math.floor(time / (1000 * 60 * 60)) % 24;
  const days = Math.floor(time / (1000 * 60 * 60 * 24));

  return `${days} days, ${hours} hours, ${minutes} minutes, ${seconds} seconds`;
};

const CustomCountdownTimer = () => {
  const [endDate] = useState(new Date('2022-12-31T00:00:00'));

  return (
    <CountdownTimer
      endDate={endDate}
      formatTime={formatTime}
      textStyle={{ fontSize: 20, color: 'red' }}
    />
  );
};

export default CustomCountdownTimer;

在上面的示例中，我們定義了一個formatTime函數來自定義時間顯示格式，并將其傳遞給CountdownTimer組件的formatTime屬性。我們還可以通過textStyle屬性來定義自定義的文本樣式。您可以根據自己的需求來調整樣式和格式。