Download intl relativeformat - intl relativeformat Download de código fonte

intl relativeformat

Dados do site

v2.1.0 — short relative formats

Baixar

Este pacote foi preterido

Guia de migração

Este pacote se desviou das especificações Intl.RelativeTimeFormat com bastante força. Portanto, depreciamos este pacote e adicionamos `@formatJS/Intl-RelativeTimeFormat como o polifill compatível com especificações.

Todas units (como day-short ) devem ser migradas de maneira semelhante a:

 new IntlRelativeFormat ( 'en' , { units : 'second-short' } ) . format (
  Date . now ( ) - 1000
) ;
// will be
new Intl . RelativeTimeFormat ( 'en' , { style : 'short' } ) . format ( - 1 , 'second' ) ;

new IntlRelativeFormat ( 'en' , { units : 'day-narrow' } ) . format (
  Date . now ( ) - 48 * 3600 * 1000
) ;
// will be
new Intl . RelativeTimeFormat ( 'en' , { style : 'narrow' } ) . format ( - 2 , 'day' ) ;

style: numeric se tornará numeric: always por especificação (que também é o padrão)

 new IntlRelativeFormat ( 'en' , {
  units : 'second-short' ,
  style : 'numeric'
} ) . format ( Date . now ( ) - 1000 ) ;
// will be
new Intl . RelativeTimeFormat ( 'en' , { style : 'short' } ) . format ( - 1 , 'second' ) ;

 new IntlRelativeFormat ( 'en' , { units : 'day-narrow' , style : 'numeric' } ) . format (
  Date . now ( ) - 48 * 3600 * 1000
) ;
// will be
new Intl . RelativeTimeFormat ( 'en' , { style : 'narrow' } ) . format ( - 2 , 'day' ) ;

style: 'best fit' é um pouco mais complicado, mas lançamos @formatjs/intl-utils para facilitar a transição:

 new IntlRelativeFormat ( 'en' , { style : 'best fit' } ) . format ( Date . now ( ) - 1000 ) ;
// will be
import { selectUnit } from '@formatjs/intl-utils' ;
const diff = selectUnit ( Date . now ( ) - 1000 ) ;
new Intl . RelativeTimeFormat ( 'en' , { numeric : 'auto' } ) . format (
  diff . value ,
  diff . unit
) ;

 new IntlRelativeFormat ( 'en' , { style : 'best fit' } ) . format (
  Date . now ( ) - 48 * 3600 * 1000
) ;
// will be
import { selectUnit } from '@formatjs/intl-utils' ;
const diff = selectUnit ( Date . now ( ) - 48 * 3600 * 1000 ) ;
new Intl . RelativeTimeFormat ( 'en' , { numeric : 'auto' } ) . format (
  diff . value ,
  diff . unit
) ;

Se você estava usando options.now agora no format , pode usar formatjs/intl-utils para fazer a transição também

 new IntlRelativeFormat ( 'en' , { style : 'best fit' } ) . format ( Date . now ( ) - 1000 , {
  now : Date . now ( ) + 1000
} ) ;
// will be
import { selectUnit } from '@formatjs/intl-utils' ;
const diff = selectUnit ( Date . now ( ) - 1000 , Date . now ( ) + 1000 ) ;
new Intl . RelativeTimeFormat ( 'en' , { numeric : 'auto' } ) . format (
  diff . value ,
  diff . unit
) ;

 new IntlRelativeFormat ( 'en' , { style : 'best fit' } ) . format (
  Date . now ( ) - 48 * 3600 * 1000 ,
  { now : Date . now ( ) + 1000 }
) ;
// will be
import { selectUnit } from '@formatjs/intl-utils' ;
const diff = selectUnit ( Date . now ( ) - 48 * 3600 * 1000 , Date . now ( ) + 1000 ) ;
new Intl . RelativeTimeFormat ( 'en' , { numeric : 'auto' } ) . format (
  diff . value ,
  diff . unit
) ;

Intl RelityFormat

Formatos JavaScript datas para seqüências de tempo relativas (por exemplo, "3 horas atrás").

Visão geral

Metas

Este pacote tem como objetivo fornecer uma maneira de formatar diferentes variações de tempo relativo. Você pode usar este pacote no navegador e no servidor via node.js.

Essa implementação é muito semelhante ao Moment.js, no conceito, embora forneça apenas recursos de formatação com base nos dados do Unicode CLDR Locale, um padrão do setor que suporta mais de 200 idiomas.

Como funciona

 var rf = new IntlRelativeFormat ( locales , [ options ] ) ;

Os locales podem ser uma única tag de idioma, por exemplo, "en-US" ou uma matriz deles a partir da qual a primeira partida será usada. options fornecem uma maneira de controlar a saída da sequência de tempo relativa formatada.

 var output = rf . format ( someDate , [ options ] ) ;

Exemplo de uso comum

A maneira mais comum de usar esta biblioteca é construir uma instância IntlRelativeFormat e reutilizá -la muitas vezes para formatar diferentes valores de data; por exemplo:

 var rf = new IntlRelativeFormat ( 'en-US' ) ;

var posts = [
  {
    id : 1 ,
    title : 'Some Blog Post' ,
    date : new Date ( 1426271670524 )
  } ,
  {
    id : 2 ,
    title : 'Another Blog Post' ,
    date : new Date ( 1426278870524 )
  }
] ;

posts . forEach ( function ( post ) {
  console . log ( rf . format ( post . date ) ) ;
} ) ;
// => "3 hours ago"
// => "1 hour ago"

Características

Opções de estilo para "best fit" ("ontem") e "numeric" ("1 dia atrás") saída com base nos limites.
Opções de unidades para sempre renderizar em uma determinada unidade; Por exemplo, "30 dias atrás", em vez de "1 mês atrás".
Capacidade de especificar o valor "agora" a partir do qual o tempo relativo é calculado, permitindo format() .
Saída de formato em seqüências de tempo relativas usando `intl.relativeTimeFormat
Otimizado para chamadas repetidas para um método format() da instância IntlRelativeFormat .

Uso

Dependência `Intl`

Este pacote assume os seguintes recursos da Intl :

Intl.PluralRules
Intl.RelativeTimeFormat

Se o seu ambiente não os suportar, sinta -se à vontade para pegar poli -preenchimentos:

https://www.npmjs.com/package/intl-pluralrules
https://www.npmjs.com/package/@formatjs/intl-relativeFormat

Carregando IntlrelativeFormat em Node.js

Instale o pacote e o Polyfill:

npm install intl-relativeformat --save

Simplesmente require() este pacote:

 var IntlRelativeFormat = require ( 'intl-relativeformat' ) ;
var rf = new IntlRelativeFormat ( 'en' ) ;
var output = rf . format ( dateValue ) ;

Bundling IntlrelativeFormat com BrowSerify/Webpack/Rollup

Pacote de instalação:

npm install intl-relativeformat --save

Simplesmente require() este pacote e os locais específicos que você deseja apoiar no pacote:

 var IntlRelativeFormat = require ( 'intl-relativeformat' ) ;

NOTA: No Node.js, os dados para todos os mais de 200 idiomas são carregados junto com a biblioteca, mas ao agrupá -los com o BrowSerify/Webpack, os dados são intencionalmente ignorados (consulte package.json para obter mais detalhes) para evitar explodir o tamanho do pacote com dados que você não precisa.

API pública

Construtor `IntlRelativeFormat`

Para formatar uma data para a hora relativa, use o construtor IntlRelativeFormat . O construtor leva dois parâmetros:

Locais - {String | String []} - Uma string com uma tag BCP 47 ou uma matriz de tais strings. Se você não fornecer um local, o local padrão será usado. Quando uma variedade de locais é fornecida, cada item e seus locais ancestrais são verificados e a primeira com dados de localidade registrada é retornada. Veja: Resolução do local para obter mais detalhes.
[Opções] - {objeto} - Objeto opcional com opções definidas pelo usuário para estilos de formato. Veja: Opções personalizadas para mais detalhes.

Nota: A instância rf deve ser suficiente para todo o seu aplicativo, a menos que você queira usar opções personalizadas.

Resolução do local

IntlRelativeFormat usa um processo de resolução de localidade semelhante ao das APIs Intl integradas para determinar quais dados do local para usar com base no valor locales que passou para o construtor. O resultado desse processo de resolução pode ser determinado pela chamada do método do protótipo resolvedOptions() .

A seguir, são apresentados as etapas abstratas que IntlRelativeFormat passa para resolver o valor da localidade:

Se nenhum dados extra de localidade for carregado, o local sempre resolverá "en" .
Se os dados do local estão ausentes para um local de folhas como "fr-FR" , mas há dados para um de seus ancestrais, "fr" neste caso, seu ancestral será usado.

Se houver dados para o local especificado, esse local será resolvido; ou seja,

 var rf = new IntlRelativeFormat ( 'en-US' ) ;
assert ( rf . resolvedOptions ( ) . locale === 'en-US' ) ; // true

Os locais resolvidos agora estão normalizados; por exemplo, "en-us" resolverá: "en-US" .

Nota: Quando uma matriz é fornecida para locales , as etapas acima acontecem para cada item nessa matriz até que uma correspondência seja encontrada.

Opções personalizadas

As options opcionais de segundo argumento fornecem uma maneira de personalizar como o tempo relativo será formatado.

Unidades

By default, the relative time is computed to the best fit unit, but you can explicitly call it to force units to be displayed in "second" , "second-short" , "second-narrow" , "minute" , "minute-short" , "minute-narrow" , "hour" , "hour-short" , "hour-narrow" , "day" , "day-short" , "day-narrow" , "month" , "month-short" , "month-narrow" , "year" , "year-short" ou "year-narrow" :

 var rf = new IntlRelativeFormat ( 'en' , {
  units : 'day'
} ) ;
var output = rf . format ( dateValue ) ;

Como resultado, a saída será "70 dias atrás" em vez de "2 meses atrás".

Estilo

Por padrão, o tempo relativo é calculado como "best fit" , o que significa que, em vez de "1 dia atrás", ele será exibido "ontem" ou "em 1 ano" será "no próximo ano", etc. Mas você pode forçar a sempre usar a alternativa "numérica":

 var rf = new IntlRelativeFormat ( 'en' , {
  style : 'numeric'
} ) ;
var output = rf . format ( dateValue ) ;

Como resultado, a saída será "1 dia atrás" em vez de "ontem".

Método `resolvedOptions()`

Este método retorna um objeto com os valores de opções que foram resolvidos durante a criação de instância. Atualmente, contém apenas uma propriedade locale ; Aqui está um exemplo:

 var rf = new IntlRelativeFormat ( 'en-us' ) ;
console . log ( rf . resolvedOptions ( ) . locale ) ; // => "en-US"

Observe como o local especificado era o valor de todos os casos mais baixo: "en-us" , mas foi resolvido e normalizado para: "en-US" .

Método `format(date, [options])`

O método do formato ( que leva uma data de JavaScript ou registro de data e hora ) e os argumentos options compararão a date com "agora" (ou options.now ) e retornará a sequência formatada; Por exemplo, "3 horas atrás" no local correspondente passou para o construtor.

 var output = rf . format ( new Date ( ) ) ;
console . log ( output ) ; // => "now"

Se você deseja especificar um valor "agora", ele pode ser fornecido via options.now agora e será usado em vez de consultar Date.now() para obter o valor "agora" atual.