Реагент - относительное время ревердера каждые несколько секунд

Question

Я создаю приложение реального времени с React. Я использую Mobx как контейнер для моего состояния. . (Не имеет значения, Redy

У меня есть компонент, показывающий относительное время, так как последний заказ прибыл (<FormattedRelative /> компонент взяты из реакции-аэроропорт библиотеки - показывая что-то вроде «1 минуту назад») Это ". 1 мин. Назад «сообщение получает моментальный снимок, когда пользовательский интерфейс получает визуализацию в первый раз, но по мере того, как время идет, это становится устаревшим и неточным.

Как вы думаете, лучший и идиоматический подход, чтобы поддерживать эти сообщения в актуальном состоянии (допустим, старое не более 10 секунд)?

Должен ли я как-то планировать повторную визуализацию с помощью setInterval? Или мне нужно периодически менять какую-либо ценность e в моем магазине, поэтому мой пользовательский интерфейс повторно отображается?

Спасибо за любое предложение.

Answer 1

Попробуйте использовать react-timeago. он очень настраивается для международного использования с поддержкой локализации Пример: - Пользовательский форматтер с французскими струнами

import TimeAgo from 'react-timeago' 
import frenchStrings from 'react-timeago/lib/language-strings/fr' 
import buildFormatter from 'react-timeago/lib/formatters/buildFormatter' 

const formatter = buildFormatter(frenchStrings) 

// in your react component 
<TimeAgo date='Feb 1, 1966' formatter={formatter} />