timeago.js — это нано-библиотека размером менее 2 КБ, используемая для форматирования даты и времени с помощью выражения time ago, например: «3 часа назад».
Официальный веб-сайт. Версия React здесь: timeago-react. Версия Python здесь: timeago.
Например:
just now
12 seconds ago
2 hours ago
3 days ago
3 weeks ago
2 years ago
in 12 seconds
in 3 minutes
in 24 days
in 6 months
Установите:
npm install timeago.js
Импортируйте:
import { format, render, cancel, register } from 'timeago.js';
или импортируйте с тегом script в HTML-файл и получите доступ к глобальной переменной timeago.
```html
<script src="dist/timeago.min.js"></script>
```
Пример:
// формат времени с локалью
format('2016-06-12', 'en_US');
Существует всего 4 API.
format(date[, locale = 'en_US', opts])
, форматирует экземпляр Date / метку времени / строку даты в строку.
import { format } from 'timeago.js';
// форматирование метки времени
format(1544666010224);
// форматирование экземпляра даты
format(new Date(1544666010224));
// форматирование строки даты
format('2018-12-12');
// форматирование с локалью
format(1544666010224, 'zh_CN');
// форматирование с локалью и относительной датой
format(1544666010224, 'zh_CN', { relativeData: '2018-11-11' });
// например
format(Date.now() - 11 * 1000 * 60 * 60); // возвращает «11 часов назад»
По умолчанию используется локаль en_US, библиотека содержит встроенные en_US и zh_CN.
render(dom[, locale = 'en_US', opts])
cancel([dom])
Создают DOM-элемент с атрибутом datetime, который автоматически отображает и отменяет.
HTML-код:
```html
<div class="timeago" datetime="2016-06-30 09:20:00"></div>
```
JavaScript-код:
```ts
import { render, cancel } from 'timeago.js';
const nodes = document.querySelectorAll('.timeago');
// используем метод render для отображения узлов в реальном времени
render(nodes, 'zh_CN');
// отображаем с опциями
// render(nodes, 'en_US', { minInterval: 3 });
// отменяем все задачи рендеринга в реальном времени
cancel();
// или отменяем для конкретного элемента
cancel(nodes[0])
```
Третий параметр opts
содержит:
```ts
export type Opts = {
/** относительная дата */
readonly relativeDate?: TDate;
/** минимальный интервал обновления в реальном времени */
readonly minInterval?: number;
};
```
DOM-объект должен иметь атрибут
datetime
со строкой формата даты.
register(locale, localeFunc)
, регистрирует новую локаль, встроенные локали содержат:en_US
,zh_CN
, все локали здесь.
Вы можете зарегистрировать свой собственный язык с помощью API register
.
```ts
const localeFunc = (number: number, index: number, totalSec: number): [string, string] => {
// number: значение timeago / timein;
// index: индекс массива ниже;
// totalSec: общее количество секунд между датой, которая должна быть отформатирована, и сегодняшней датой;
return [
['just now', 'right now'],
['%s seconds ago', 'in %s seconds'],
['1 minute ago', 'in 1 minute'],
['%s minutes ago', 'in %s minutes'],
['1 hour ago', 'in 1 hour'],
['%s hours ago', 'in %s hours'],
...
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Опубликовать ( 0 )