Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React/Momentjs date formatting with line break

I have a date string that I want to format where the number is under the month:

Jul
 6

and I've tried a few different ways to add a new line:

<Moment format="MMM[\n]d">{`${date}`}</Moment>

but the result I'm getting is:

Jul\n6
like image 206
xyzcode Avatar asked Jul 06 '18 19:07

xyzcode


People also ask

What can I use instead of MomentJS?

And today, the most popular alternative to Moment. js is Day. js which surpassed date-fns on GitHub by stars (46,2k Day. js stars vs 37,7k date-fns stars).

How do I get today's date in MomentJS?

moment(). format('YYYY-MM-DD'); Calling moment() gives us the current date and time, while format() converts it to the specified format.

How do I add time to MomentJS?

To add time, pass the key of what time you want to add, and the amount you want to add. moment(). add(7, 'days'); There are some shorthand keys as well if you're into that whole brevity thing.

What is MomentJS used for?

MomentJS is a JavaScript library which helps is parsing, validating, manipulating and displaying date/time in JavaScript in a very easy way. This chapter will provide an overview of MomentJS and discusses its features in detail. Moment JS allows displaying of date as per localization and in human readable format.


1 Answers

If you want to get Tholle's solution working with react-moment, you'll want to do the following:

<Moment style={{whiteSpace: "pre"}} format={"MMM[\n]d"}>{`${date}`}</Moment>

By putting your format within brackets, the [\n] will have the desired effect.

like image 157
Chris Avatar answered Oct 02 '22 17:10

Chris