Как при помощи moment.js вывести само время и единицу времени?

Question

[Nikolay Matyushkin]

Всем привет!
Значится....я расчитываю оставшееся до 23:00:00 время

const difference = moment('2020-08-17 23:00:00').diff(moment());

Далее форматирую полученный дифференс в минуты и секунды и вывожу в jsx-коде минуты (и если осталась 1 минута, вывожу секунды)

const minutes = moment(difference).format('mm');
const seconds = moment(difference).format('ss');

<div className={s.container}>
            {parseInt(minutes) > 0 ? (
                `Осталось ${minutes} минут`
            ) : (
                `Осталось ${seconds} секунд`
            )}
        </div>

И тут сталкиваюсь с проблемой спряжения единицы времени. Т.е. 59 минут, 58, 57, 56, 55, 54 - минуты. Но в моём случае всегда минут. Та же история с секундами. Можно ли с помощью moment.js отобразить единицу времени?

Answer 1

[hzzzzl]

например

const getEnding = num => {
  const rem = num % 10
  if (rem === 0) return ''
  if (rem === 1) return 'а'
  if (rem <= 5) return 'ы'
  return ''
}

{parseInt(minutes) > 0 ? (
  `Осталось ${minutes} минут${getEnding(minutes)}`
 ) : (
   `Осталось ${seconds} секунд${getEnding(seconds)}`
)}

минут-а и секунд-а склоняются одинаково, так что подойдет для обоих слов

Answer 2

[0xD34F]

Никак. То, чего вы хотите, moment делать не умеет. Есть fromNow - но там не всё гладко (например, секунды отображаются неточно - вместо количества пишет "несколько" или округляет до минуты). Может, есть какой плагин, но это не точно и надо искать.

Ваш вариант - это вот что.

Comments

[Nikolay Matyushkin]

Да, я видел этот топик. На мой вопрос вы ответили. Момент не умеет вертеть еденицами времени. Окей, спасибо!

Answer 3

[Mikhail Osher]

import React from "react";
import moment from "moment";
import 'moment/locale/ru'; // create-react-app specific

moment.locale("ru");

const target = moment("2020-08-17 23:00:00");

const toNow = target.toNow(true);

export default function App() {
  return (
    <div>
      <p>Осталось {toNow}</p>
    </div>
  );
}