Как обернуть каждый символ в span?

Есть таймер на странице, состоит из дней, минут и секунд.

const { days, hours, minutes, seconds } = useCountdown(countdownDate);


<div className={styles.timer}>
      <div className={styles.item}>
        <div>{days || 0}</div>
        <span>days</span>
      </div>
      <div className={styles.item}>
        <div>{hours || '00'}</div>
        <span>hr</span>
      </div>
      <div className={styles.item}>
        <div>{minutes || '00'}</div>
        <span>min</span>
      </div>
      <div className={styles.item}>
        <div>{seconds || '00'}</div>
        <span>sec</span>
      </div>
    </div>


где, например seconds - выводит цельное число '57'.

А вот, как мне обернуть каждый символ в отдельный спан для стилизации - ума не приложу.

так нужно:
<span>5</span><span>7</span>
  • Вопрос задан
  • 49 просмотров
Решения вопроса 1
DELUX
@DELUX Автор вопроса
А все, справился...

Вдруг кому пригодится:

const addSpan = (note: any) => {
    return [...note].map((letter) => <span>{letter}</span>);
  };


<div>{addSpan(seconds) || '00'}</div>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы