Skip to main content

React Native + Javascript + Date Time + JSON.Stringify() + JSON.parse()

This page will capture all issues related to Date and React Native mobile app development. Will add more as I go through the development cycle. 

I will play around with Javascript for a bit before switching to TypeScript. 

Some of the information below might not be following the best practice as I just started the development process. Will update as I learn more about React Native + Javascript.

Storing Date object in AsyncStorage

You can store Date object directly into AsyncStorage. Generally in other programming language, you can store the Date object directly in a data storage. However, with React Native, you will get the the Debug Console warning on Expo Go if you do so. I recommend using JSON.stringify() command below to store the date object. Please follow the instruction below. 

On the side note, you can also store millisecond and use the date toString option but it is not recommended. I would recommend using stringify command as it will store using the toISOString() which is the ISO 8601 string format.

Prior to storing a date object in AsyncStorage, convert it to string first before you store it. Use JSON.stringify() command.


Example code:

await AsyncStorage.setItem('selectedDate', JSON.stringify(newDate));

Retrieve From AsyncStorage

retrieveDate = async () => {

    const stringifiedObject = await AsyncStorage.getItem('date'); 

    let newDate = new Date(Date.parse(JSON.parse(stringifiedObject)));

}; 

JSON.stringify() - Date double quote issue

When you use stringify on a date object, this command will add double quote (") around your date attribute. If you use the Date.parse(stringifiedObject) command here, you will get an Invalid Date error.

There are 2 options:

1. Before you use Date.parse command to change it back to a date object, make sure you remove the double quote; or,

2. The better option is to use the command: new Date(Date.parse(JSON.parse(stringifiedObject)))


So yes, I recommend the following option to create a date option out of a stringified date:

let sampleDate = new Date(Date.parse(JSON.parse(stringifiedObject)));

Comments

Popular posts from this blog

Checked! Task Pro for Android

SMART task system that combine the best of task management methodologies Natively Built for Android! The best Task, Note, and Calendar Master from BlackBerry is now available on Android! Please scroll to near bottom to see information on the Smart Task system - most efficient approach to manage your tasks and projects. Android Store link ------------------------------------------------- Instructions: Checked! Task Pro Instruction ------------------------------------------------- Current features: Use Speech to text icon to automatically add new task and calendar entry: e.g. Meet John tomorrow (use keyword similar to Smart Add feature below). Smart Add featuring category and natural language parsing for extremely fast event creation: Dr appointment on Dec 1, 2016 at 5pm Pick up airport tomorrow Meet John next Monday at 5PM Email Shawn tomorrow @Tax Finish tax in 5 days // Tax is a category Superb fluid user interface. Ultimate task and project management application SMART task system -

Bartender Cocktails and Drink 30,000+ for BlackBerry 10

Calling all cocktails & drinks lovers! This is the most wanted intelligent Cocktails & Drinks recipe application. It contains 30,000+ easy-to-follow cocktails and drinks with photo capability. No internet/Wifi connection required! You can also search any drink recipes easily, or even add your own invented cocktails and drinks! 

New Site

Testing the new site! The focus will be on Project Portfolio Management and Software Development. Hope everyone's having a great day!