I'm new in react native.I want store multiple small small strings to common singleton object class and want to access it from singleton object for all component. Can anyone help me singleton object implementation for react native.
Ex
Component 1 -- Login button -- >> success --> need to store userID into singleton object.
Component 2 --> get stored userID from singleton object. How can i implement it.
3 Answers
Answers 1
I suggest making a static class that stores data using AsyncStorage. You mentioned in a comment that you are already using AsyncStorage, but don't like spreading this functionality throughout your app. (i.e. try-catches all over the place, each component needing to check if a key is available, etc.) If this functionality were in a single class, it would clean up your code a lot.
Another bonus to this approach is that you could swap out the implementation pretty easily, for example you could choose to use an in memory object or AsyncStorage or whatever and you would only have to change this one file
NOTE: AsyncStorage is not a safe way to store sensitive information. See this question for more info on the security of AsyncStorage and alternatives.
That said, this is how I imagine a global data holder class might look:
export default class dataManager { static storeKeyValue(key, value) { // your choice of implementation: // check if key is used // wrap in try-catch // etc. } static getValueForKey(key) { // get the value out for the given key } // etc... } Then to use this class anywhere in your app, just import wherever it's needed like so:
import dataManager from 'path/to/dataManager.js'; // store value dataManager.storeKeyValue('myKey', 'myValue'); // get value const storedValue = dataManager.getValueForKey('myKey'); EDIT: Using Flux, Redux, or a similar technology is probably the preferred/suggested way to do this in most cases, but if you feel the Singleton pattern works best for your app then this is a good way to go. See: You Might Not Need Redux
Answers 2
There is a workaround for this, react native packager require all the modules in the compilation phase for a generating a bundle , and after first require it generates an internal id for the module, which is from then on referenced in the whole run-time memory , so if we export an instance of a class from the file, that object will be referenced every-time whenever that file is imported .
TLDR;
Solution I :
class abc { } module.exports = new abc() Solution II : I assume you want to get your strings which are static and wont change , so you can declare them as static and access them directly with class name
FYI :this works with webpack also.
Answers 3
Here is a simple way of doing it...
export default class CommonDataManager { static myInstance = null; _userID = ""; /** * @returns {CommonDataManager} */ static getInstance() { if (this.myInstance == null) { this.myInstance = new CommonDataManager(); } return myInstance; } getUserID() { return this._userID; } setUserID(id) { this._userID = id; } } And here is how to use it...
import CommonDataManager from './CommonDataManager'; // When storing data. let commonData = CommonDataManager.getInstance(); commonData.setUserID("User1"); // When retrieving stored data. let commonData = CommonDataManager.getInstance(); let userId = commonData.getUserID(); console.log(userId); Hope this works out for you :)
0 comments:
Post a Comment