Socket
Socket
Sign inDemoInstall

timeago-react

Package Overview
Dependencies
Maintainers
2
Versions
20
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

timeago-react

timeago-react is a simple(only 1kb) react component used to format date with `*** time ago` statement. eg: '3 hours ago'.


Version published
Maintainers
2
Created
Source

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 * as 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.

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

The datetime to be calculated interval relative to.

  • opts.minInterval (optional, number in seconds)

The min interval in seconds to update the ** time ago string

  • 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:

import * as 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

Keywords

FAQs

Package last updated on 04 Mar 2023

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc