Question

我正在用React创建一个实时应用程序。我正在使用Mobx作为我的状态容器。（无所谓，雷迪

我有一个显示相对时间的组件，因为最后一个订单到了。（<FormattedRelative />组件来自react-intl库 - 显示类似“1分钟前”的内容。当首次呈现UI时，此“1分钟前”消息将被快照。但随着时间的推移，这已经过时且不准确。

您认为保持这些消息最新的最佳和惯用方法是什么（让我们说最多10秒）？

我应该以某种方式安排使用setInterval重新渲染吗？或者我应该定期更改商店中的某些值，以便重新呈现我的UI？

感谢您的任何建议。

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} />

反应 - 每隔几秒重新渲染相对时间

1 个答案: