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

React - rerender relative time every few seconds

本文关键字:几秒 相对 时间 反应      更新时间:2023-09-26

我正在用React创建一个实时应用程序。我使用Mobx作为我的状态容器。没关系,ready

我有一个组件显示相对时间,因为最后一个订单已经到达。(<FormattedRelative />组件取自react-intl库)显示"1分钟前"之类的内容)。当UI第一次被渲染时,这个"1分钟前"的消息被快照。但随着时间的推移,这变得过时和不准确。

你认为保持这些消息最新(让我们说最多10秒)的最好和惯用的方法是什么?

我应该安排重新渲染与setInterval?或者我是否应该定期更改商店中的某些值,以便重新渲染UI ?

谢谢你的建议

尝试使用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} />