Обратный отсчет даты-года с годами, месяцами, днями, часами и минутами - PullRequest
2 голосов
/ 13 мая 2019

Я использую DateFNS , и мне нужно создать обратный отсчет с ним.distanceInWordsToNow только выводит примерно через 3 года , но мне нужно точное время, как 3 Years, 11 Months, 20 Days, 3 Hours, 2 Minutes.Как заархивировать это с помощью DateFNS?

Вот пример CodePen: https://codepen.io/anon/pen/qGajJB

SCRIPT

todaysDateMin: dateFns.distanceInWordsToNow(new Date(2022, 6, 2, 0, 0, 15), {addSuffix: true})

Ответы [ 2 ]

3 голосов
/ 16 мая 2019

Вы можете попробовать что-то вроде этого:

let humanizeFutureToNow = fDate => {
  let result = [], now = new Date()
  let parts = ['year', 'month', 'day', 'hour', 'minute']

  parts.forEach((p, i) => {
    let uP = p.charAt(0).toUpperCase() + p.slice(1)
    let t = dateFns[`differenceIn${uP}s`](fDate, now);
    if (t) {
      result.push(`${i===parts.length-1 ? 'and ' : ''}${t} ${uP}${t===1 ? '' : 's'}`);
      if (i < parts.length)
        fDate = dateFns[`sub${uP}s`](fDate, t);
    }
  })
  return result.join(' ');
}

console.log(humanizeFutureToNow(new Date('2022-11-11')))
<script src="https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.min.js"></script>

Идея состоит в том, чтобы выполнить все нужные вам периоды времени (и иметь поддерживаемые функции date-fns) и сгенерировать массив со всеми строками. Мы делаем это, выполняя сначала поддерживаемый differenceIn<PARTGOESHERE>, чтобы получить время distance, а затем вычитаем его, используя функцию sub<PARTGOESHERE>. После этого просто присоединитесь к ним, чтобы составить окончательную строку.

Отсюда вы можете настраивать и экспортировать детали в качестве параметра, а также верхний регистр первых букв в выводе и т. Д. И т. Д.

Вот также версия lodash:

let humanizeFutureToNow = fDate => {
  let result = [], now = new Date()
  let parts = ['year', 'month', 'day', 'hour', 'minute']

  _.each(parts, (p, i) => {
    let scPart = _.startCase(p)
    let t = _.invoke(dateFns, `differenceIn${scPart}s`, fDate, now);
    if (t) {
      result.push(`${i===parts.length-1 ? 'and ' : ''}${t} ${scPart}${t===1 ? '' : 's'}`);
      if (i < parts.length)
        fDate = _.invoke(dateFns, `sub${scPart}s`, fDate, t);
    }
  })
  return result.join(' ');
}

console.log(humanizeFutureToNow(new Date('2022-11-11')))
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.30.1/date_fns.min.js"></script>
2 голосов
/ 16 мая 2019

Используйте следующие функции dateFns для получения компонентов, затем объедините их вместе со строками.

пусть х будет меньше года, у будет больше сохранить разность, вызванную годами х и у, что дает целое число лет в переменной передайте x и в качестве параметра для addYears присвойте x

вызовите разницу в месяцах по x и y, сохраните вызовите addMonths для x и это сэкономило количество месяцев

сделать то же самое с разницей в днях и добавлениями, разностями в часах и добавлениями Теперь x находится менее чем в 60 минутах от y, поэтому вызовите разностьInMinutes, и все готово (при условии, что ваш countDown уменьшен до минуты).

Вот ваш пример запуска на runkit.com для иллюстрации метода.

var dateFns = require("date-fns");
var x = new Date();
var y = new Date(2022, 2, 6, 0, 0, 15);
var temp;
temp = dateFns.differenceInYears(y, x);
var result = temp + " years ";
x = dateFns.addYears(x, temp);
temp = dateFns.differenceInMonths(y, x);
result = result + temp + " months ";
x = dateFns.addMonths(x, temp);
temp = dateFns.differenceInDays(y, x);
result = result + temp + " days ";
x = dateFns.addDays(x, temp);
temp = dateFns.differenceInHours(y, x);
result = result + temp + " hours ";
x = dateFns.addHours(x, temp);
temp = dateFns.differenceInMinutes(y, x);
result = result + temp + " minutes ";
x = dateFns.addMinutes(x, temp);
temp = dateFns.differenceInSeconds(y, x);
result = result + temp + " seconds";
console.log(result);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...