2017-01-16 4 views
0

です。反応成分はありますが、使用方法はわかりません。 と何が、私は、文字列のテンプレートを指定ES6に予め

答えて

2

バッククォート( `)でそのexpiryDate感謝の値を変更することができますどのようにこの

<div className="f4InputCreditCardFrontExpiryDate" style={{ position: 'absolute ', bottom: 0 , right: 0}}> 
    <span style={{ 
      color: 'white' 
     }}> 
      { `${expiryDate}` } 
    </span> 
</div> 

の意味です。ドル記号$に続けて中括弧{}を入力すると、その変数の文字列値が文字列に書式設定されます。

例で説明するのが最も簡単です。

const a = 'world'; 
console.log(`hello ${a}`); // hello world 

他の文字列は、そのテンプレートでフォーマットしないされているので、あなただけの

{expiryDate} 

と同じ出力を得ることができてあなたの例に示す書式文字列は、実際には冗長です。

+0

しかし、私は私がその文字列のテンプレートを変更する方法 ことによってそれをレンダリングコンポーネントとを持っている場合は? –

+0

「文字列テンプレートを変更してください」と聞いているのですか?ドル記号変数参照の外で、テンプレート内に自由に文字を挿入することができます。 – LINKIWI

+0

シナリオ 文字列テンプレートを持つ外部コンポーネントがあり、これをプロジェクトにインポートしています。どのようにコンポーネントを使用する場合は、私のプロジェクト側で文字列テンプレートを変更することができます

関連する問題