該軟件包與Intl.RelativeTimeFormat規格偏離。因此,我們已經棄用了此軟件包,並添加`@formatjs/intl-relativetimeformat作為符合規格的polyfill。
units (例如day-short )的遷移應類似於: 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將變成numeric: always每個規格(這也是默認值) 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'有點棘手,但我們已經發布了@formatjs/intl-utils來簡化過渡: 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
) ;options.now format ,則可以使用formatjs/intl-utils進行過渡 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
) ;格式的JavaScript可追溯到相對時間字符串(例如,“ 3小時前”)。
該軟件包旨在提供一種格式化相對時間不同變化的方法。您可以通過Node.js在瀏覽器和服務器上使用此軟件包。
該實現與MONT.JS在概念上非常相似。
var rf = new IntlRelativeFormat ( locales , [ options ] ) ; locales可以是單個語言標籤,例如"en-US" ,也可以是其中的第一個匹配項。 options提供了一種控制格式化相對時間字符串輸出的方法。
var output = rf . format ( someDate , [ options ] ) ;使用此庫的最常見方法是構建一個IntlRelativeFormat實例,並多次重複使用以格式化不同的日期值。例如:
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"基於閾值的"best fit" (“昨天”)和"numeric" (“ 1天前”)的樣式選項。
單位選項始終在特定單元中渲染;例如“ 30天前”,而不是“ 1個月前”。
能夠指定從中計算相對時間的“現在”值,從而允許format() 。
使用`intl.relativetimeformat中的相對時間字符串的格式輸出
針對重複調用IntlRelativeFormat實例的format()方法進行了優化。
Intl依賴性該軟件包假定Intl的以下功能:
Intl.PluralRulesIntl.RelativeTimeFormat如果您的環境不支持這些,請隨時抓住多填充:
安裝軟件包和polyfill:
npm install intl-relativeformat --save require()此軟件包:
var IntlRelativeFormat = require ( 'intl-relativeformat' ) ;
var rf = new IntlRelativeFormat ( 'en' ) ;
var output = rf . format ( dateValue ) ;安裝程序包:
npm install intl-relativeformat --save require()此軟件包和您希望在捆綁包中支持的特定地區:
var IntlRelativeFormat = require ( 'intl-relativeformat' ) ;注意:在node.js中,所有200多種語言的數據都與庫一起加載,但是當將其與browserify/webpack捆綁在一起時,有意忽略了數據(有關更多詳細信息,請參見package.json ),以避免用可能不需要的數據炸毀捆綁包的大小。
IntlRelativeFormat構造函數要將日期格式化為相對時間,請使用IntlRelativeFormat構造函數。構造函數採用兩個參數:
LOCERES- {字符串|字符串[]} - 具有BCP 47語言標籤的字符串或此類字符串數組。如果您不提供語言環境,則將使用默認場所。提供一系列位置時,將檢查每個項目及其祖先地點,並返回帶有註冊語言環境數據的第一個。請參閱:本地分辨率有關更多詳細信息。
[選項] - {Object} - 具有用戶定義的格式樣式選項的可選對象。請參閱:自定義選項以獲取更多詳細信息。
注意:除非您要使用自定義選項,否則rf實例應該足夠整個應用程序。
IntlRelativeFormat使用類似於內置Intl API的區域分辨率過程,以確定基於傳遞給構造函數的locales值使用的語言環境數據。該分辨率過程的結果可以通過調用resolvedOptions()原型方法來確定。
以下是IntlRelativeFormat進行的抽象步驟來解析語言環境值:
如果沒有加載額外的語言環境數據,則該語言環境將始終解決為"en" 。
如果諸如"fr-FR"之類的葉片區域缺少該位置數據,但是有一個祖先的數據,在這種情況下, "fr" ,則將使用其祖先。
如果有指定的語言環境的數據,則該區域將解決; IE,
var rf = new IntlRelativeFormat ( 'en-US' ) ;
assert ( rf . resolvedOptions ( ) . locale === 'en-US' ) ; // true現在已解決的地區已歸一化;例如, "en-us" "en-US" 。
注意:當為locales提供一個數組時,該數組中的每個項目都會發生上述步驟,直到找到匹配為止。
可選的第二個參數options提供了一種自定義相對時間格式的方法。
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"或"year-narrow" :
var rf = new IntlRelativeFormat ( 'en' , {
units : 'day'
} ) ;
var output = rf . format ( dateValue ) ;結果,輸出將是“ 70天前”,而不是“ 2個月前”。
默認情況下,相對時間被計算為"best fit" ,這意味著它將顯示為“昨天”或“ 1年”將是“明年”等。但是您可以強迫始終使用“數字”替代方案:
var rf = new IntlRelativeFormat ( 'en' , {
style : 'numeric'
} ) ;
var output = rf . format ( dateValue ) ;結果,輸出將是“ 1天前”而不是“昨天”。
resolvedOptions()方法此方法返回一個具有實例創建期間已解決的選項值的對象。目前,它僅包含一個locale屬性;這是一個例子:
var rf = new IntlRelativeFormat ( 'en-us' ) ;
console . log ( rf . resolvedOptions ( ) . locale ) ; // => "en-US"請注意,指定的語言環境是所有低案例值: "en-us" ,但已解決並歸一化為"en-US" 。
format(date, [options])方法格式方法(獲取JavaScript日期或時間戳)和可選options參數將將date與“ NOW”(或options.now )進行比較,並返回格式化的字符串;例如,“ 3小時前”在相應的語言環境中傳遞到構造函數中。
var output = rf . format ( new Date ( ) ) ;
console . log ( output ) ; // => "now"如果您希望指定“現在”值,則可以通過options.now提供它,並將使用而不是查詢Date.now()以獲取當前的“現在”值。
該軟件可以在Yahoo!下免費使用。 Inc. BSD許可證。有關許可文本和版權信息,請參見許可證文件。