Get Current Date With Month And Year in React Native Android iOS

The JavaScript’s inbuilt function Date().getDate() gives us the facility to retrieve Get Current Date With Month And Year in both android and iOS applications on button click. So in this tutorial we would going to get current date using Date().getDate() function, retrieve current month using Date().getMonth() function and current year using  Date().getFullYear() function and display inside react native app using Alert dialog.

Contents in this project Get Current Date With Month And Year in React Native App:

1. Import StyleSheet, View, Alert and Button component in your project.

2. Create a function named as ShowCurrentDate(). Now we would get current date, month and year using Date() function and store each value into separate Var variable. Finally we would show all values on application screen with – (Dash) into Alert dialog.

NoteWe need to +1 to month to show the correct month because by default in react native January starts from 0(Zero).

3. Create a Parent View in render’s return block and add a Button component inside it. Now we would set onPress event on button and call the ShowCurrentDate() function on button onPress.

4. Create Style for View.

5. Complete source code for App.js File :

 

Screenshot in Android device :

Get Current DateScreenshot in iOS Application :

12 Comments

  1. how to show current date like this – Wed , May 2

    • Swati you need to use the function Date().getDay(); it will return you day in number now here 1 stands for Monday and 2 stands for Tuesday like that so 1 to 7 is day code, Now using the if condition you need to convert number into day, and the same part as months starts from 0 to 12 so you also need to convert month.

      • Thanks for this sir. Can you confirm what datatype is the day/month etc returned as? Because I’m not able to use it in a function like this:

        var month; month = today.getMonth();
        var monthName = {month}==”0″?’January’:
        {month}==”1″?’February’:
        {month}==”2″?’March’:
        {month}==”3″?’April’:
        {month}==”4″?’May’:
        {month}==”5″?’June’:
        {month}==”6″?’July’:
        {month}==”7″?’August’:
        {month}==”8″?’September’:
        {month}==”9″?’October’:
        {month}==”10″?’November’:’December’
        ;

        //(above doesn’t work)

  2. Thank you sir
    But this process is lengthy and it will slow other functions like I am using time function and after that I click button to move next page it take lot of time to move.

  3. exit(“Nice tutorial again~”);

  4. how to get the next month date from today date..

    e.g : i want to show the next month date in Text tag, and my date will be exact date from today date…

    like today is 2019-06-26

    i want to display the date 2019-07-26 in text tag without any function..

    • Adnana to make this functionality you need to check the year and month and date. First check the month is always less than 12 and and if yes then increase month to +1. Now if month successfully updated then check if month is less than 12 then the year is same and if the month is grater then also increase the month and finally according to month check the date is still present on same month if not then you can set any date.

  5. var todayDate = new Date;
    var actualDate = new Date(todayDate); // convert to actual date means today’s date

    //FOR NEXT MONTH date

    var expDate = new Date(actualDate.getFullYear(), actualDate.getMonth() + 1, actualDate.getDate()).toDateString();

    {this.expDate} —> in between Text tag

    when i put this.expDate in text tag it doesn’t show anything.. but when if i do on “console.log(expDate )” it will give me exact one month date like ‘Jul 26 2019 ‘

Leave a Reply

Your email address will not be published.