Popularity
2.9
-
Activity
4.0
-
220
6
17

Monthly Downloads: 0
Programming language: JavaScript
License: MIT License
Latest version: v3.0.0

timeago-react alternatives and similar libraries

Based on the "Time / Date / Age" category

Do you think we are missing an alternative of timeago-react or a related project?

Add another 'Time / Date / Age' Library

README

timeago-react

timeago-react is a simple react component used to format date with *** time ago statement. eg: '3 hours ago'.

The component based on timeago.js which is a simple javascript module.

  • Realtime render. Automatic release the resources.
  • Simple. Only 2kb.
  • Efficient. When the time is 3 hour ago, the interval will an hour (3600 * 1000 ms).
  • Locales supported.

npm build demo npm react supported npm

Install

npm install timeago-react

Usage

import React from 'react';
import TimeAgo from 'timeago-react'; // var TimeAgo = require('timeago-react');

<TimeAgo
  datetime={'2016-08-08 08:08:08'}
  locale='zh_CN'
/>

Component props

  • datetime (required, string / Date / timestamp)

The datetime to be formatted. can be datetime string, Date instance, or timestamp.

  • live (optional, boolean)

Live render, default is true.

  • className (optional, string)

The class of span. you can setting the css style of span by class name.

  • locale (optional, string)

The locale language of statement, default is en. All supported locales here. If you want to use locale which is not zh_CN / en, you should import the locale before use it. As below:

  • opts.relativeDate (optional, string / Date / timestamp)

The datetime to be calculated interval relative to.

  • opts.minInterval (optional, number)

The min interval to update the ** time ago string

import React from 'react';
import TimeAgo from 'timeago-react';
import * as timeago from 'timeago.js';

// import it first.
import vi from 'timeago.js/lib/lang/vi';

// register it.
timeago.register('vi', vi);

// then use it.
<TimeAgo
  datetime={'2016-08-08 08:08:08'}
  locale='vi'
/>
  • style (optional, object)

The style object to applied to the root element.

Props not documented above are applied to the root element.

LICENSE

MIT


*Note that all licence references and agreements mentioned in the timeago-react README section above are relevant to that project's source code only.