मैं स्थानीय रूप से रिएक्ट नेटिव में वस्तुओं और सरणियों को संग्रहीत करने का एक तरीका ढूंढ रहा हूं। यह कैसे किया जा सकता है? AsyncStorage के लिए एपीआई को देखते हुए:

स्थिर setItem (कुंजी: स्ट्रिंग, मान: स्ट्रिंग, कॉलबैक ?:? (त्रुटि: त्रुटि) = & gt; शून्य)
कुंजी के लिए मान सेट करता है और कोई भी त्रुटि होने पर कॉलबैक पूर्ण होने पर कॉल करता है। एक वादा वस्तु लौटाता है।

मैं कैसे प्रतिक्रिया मूल में वस्तुओं और सरणियों को स्थानीय रूप से संग्रहीत करता हूं?

15
Nader Dabit 18 नवम्बर 2015, 23:54

2 जवाब

सबसे बढ़िया उत्तर

JSON.stringify ({}) का उपयोग आपकी डेटा संरचना को स्ट्रिंग में बदलने के लिए किया जा सकता है।

फिर आप स्ट्रिंग को मूल डेटा संरचना में बदलने के लिए JSON.parse () का उपयोग करेंगे।

आप अपने ऐप में कुछ बॉयलरप्लेट कोड को खत्म करने के लिए इसके लिए एक अच्छी सेवा बना सकते हैं। मैंने नीचे दिए गए उदाहरण में "लगातार" भंडारण सुविधा के रूप में रिएक्ट नेटिव के अंतर्निर्मित AsyncStorage API का उपयोग किया है। जैसा कि आप फिट देखते हैं, इसे अपनाएं।

रिएक्ट नेटिव का उपयोग करके उदाहरण

किसी ऑब्जेक्ट को स्टोर करने के लिए JSON API का उपयोग करना, अर्थात React Native's AyncStorage, और फिर उस मान को पुनः प्राप्त करना, और उसे टेक्स्ट तत्व में आउटपुट करना। Untested ।

Storage.js फ़ाइल - ध्यान दें, यह उदाहरण ऑब्जेक्ट API एक प्रतिक्रिया प्रदान करता है सब्सक्राइबर्स AsyncStorage एपीआई प्रदान करता है के आसपास रैपर, आप इसे एक समय में एक के बजाय कई कुंजी उदाहरण के लिए सेट करने की अनुमति दे सकते हैं।

//./storage.js
const Storage = {

    getItem: async function (key) {
        let item = await AsyncStorage.getItem(key);
        //You'd want to error check for failed JSON parsing...
        return JSON.parse(item);
    },
    setItem: async function (key, value) {
        return await AsyncStorage.setItem(key, JSON.stringify(value));
    },
    removeItem: async function (key) {
        return await AsyncStorage.removeItem(key);
    }
};

प्रतिक्रियाशील मूल घटक

//Usage...
import React, {Component} from "react";
import { View, Text } from "react-native";
import Storage from "./storage";

class Foo extends Component {

    constructor (props) {

        super(props);

        this.state = {
            greeting: ""
        };
    } 

    async componentDidMount () {

        await Storage.setItem("someObj", {value: "bar", id: 1});

        let obj = await Storage.getItem("someObj");

        this.setState({
             greeting: obj.value // Will be "bar" 
        });

    }

    render () {

         return (
               <View>
                    <Text>{this.state.greeting}</Text>
               </View>
         );
    }
}

मूल उदाहरण:

जैसा कि मैंने मूल रूप से मोबाइल पर इसका उत्तर दिया था, मैंने मूल रूप से HTML5 लोकलस्टोरेज एप का उपयोग एक उदाहरण के रूप में किया था, यह टाइप करने के लिए तेज था (और यह ठंडा था!), यहां यह सिर्फ मामले में किसी पर प्रतिक्रिया के लिए भूमि है, प्रतिक्रिया नहीं- देशी गलती से।

var StorageService = function  () {};

StorageService.prototype.get = function (key) {
    return JSON.parse(window.localStorage.getItem(key));
};

StorageService.prototype.set = function (key, value) {
    return window.localStorage.setItem(key, JSON.stringify(value));
};
30
Lee Brindley 6 जिंदा 2019, 21:03

हाल ही में मैंने pleex लिखा है, तो आप इसे देख सकते हैं । आप शुद्ध जोंस में डेटा को सेव कर सकते हैं या टाइपकास्ट करने की सुविधा और अधिक के साथ स्कीमा बना सकते हैं। धन्यवाद

1
sina farhadi 13 मई 2020, 13:27