2016-05-07 4 views
1

ich dies zu machen versuche:Reagieren - Rendering mit moment.js

<p>Some date: {moment('12-25-1995', 'MM-DD-YYYY')}</p> 

und immer Fehler

Uncaught Invariant Violation: Objects are not valid as a React child (found: Mon Dec 25 1995 00:00:00 GMT+0100). If you meant to render a collection of children, use an array instead or wrap the object using createFragment(object) from the React add-ons. Check the render method of `MeetingComponent`. 

Ich sehe dies ist eine gemeinsame Antwort reagieren, wenn die Ausgabe Objekte versuchen.

Was wäre die Best-Practice-Lösung dafür?

Antwort

1

Sie sollten die format-Funktion von Moment verwenden, um eine Zeichenfolge zurückzugeben, andernfalls versuchen Sie, ein Moment-Objekt zu rendern!

<p>Some date: {moment('12-25-1995', 'MM-DD-YYYY').format('MM/DD/YYYY')}</p> 

Lassen Sie mich dies gründlich mehr erklären: die moment Konstruktor zwei Parameter verarbeiten kann, wobei die erste die Aktualität und die zweite das Format des Datums wird als erster Parameter übergeben. Dies hat nichts mit dem Rendern des Datums zu tun, sondern erlaubt nur MomentJS, eine korrekte Darstellung Ihres Datums zu erstellen, und der zweite Parameter kann weggelassen werden, wenn das Standardformat JJJJ-MM-TT verwendet wird.

Sobald Sie einen Moment Objekt haben, können Sie mit ihm ein paar nette Dinge zu tun, wie Tage hinzufügen, die Differenzen zwischen zwei Daten, formatieren Sie ein Datum in einem beliebigen Format, etc ...

Wenn Sie bereits das Datum haben In Ihrem gewünschten Format müssen Sie Moment nicht zum Drucken verwenden - Sie haben bereits die richtige Zeichenfolge. Aber Sie können Moment verwenden ändern Sie das Format Ihres Datums und drucken Sie es in einigen anderen:

<p>Some date: {moment('12-25-1995', 'MM-DD-YYYY').format('YYYY/MM/DD')}</p> 
+0

Großartig, danke für Ihre Mühe! –

+1

Gute Antwort, aber es ist erwähnenswert, dass es tatsächlich einige Überladungen im Moment Konstruktor gibt, insbesondere strikter Modus und Gebietsschema zusätzlich zu dem, was Sie hier erwähnt haben. http://momentjs.com/docs/#/parsing/ –