Question

react-intlを使用して別の区切り記号を使用して日付を表示する必要があります。 は、これまでのところ、私はこの

const date = new Date("2016-08-12T16:59:02.013+02:00"); 
... 
return() { 
    render(
     <FormattedDate 
      value={date} 
      year='numeric' 
      month='numeric' 
      day='numeric' 
      /> 
    ) 
} 

を持っているこれは、日付2016年8月12日をレンダリングしますが、私はこの2016年8月12日のようにそれを表示する必要があります。 これはどのようにFormattedDateで行うことができますか？あるいは私は別のアプローチをとるべきですか？

Answer 1

まず、反応-intlのパッケージからhocをインポート：あなたのコンポーネントに適用し、その後

import {injectIntl} from 'react-intl' 

：

injectIntl(YourReactComponent) 

それはあなたがYourReactComponentにprops経由formatDateメソッドにアクセスできるようになります。この方法は、FormattedDateのインスタンスによって内部的に使用され、それがフォーマットされた日付の文字列表現を返します。

const stringDate = this.props.intl.formatDate(date, // your date variable 
      { 
       year:'numeric', 
       month:'numeric', 
       day:'numeric' 
      }) 

stringDateは今8/12/2016が含まれているあなたが好きなように、あなたはそれを修正することができます。

const stringWithHyphens = stringDate.replace(/\//g, "-"); // replacing all '/'s with '-'s