मैं अपने JSON डेटा को फ़्लैटलिस्ट में मैप करना चाहता हूं ताकि मैं डेटाबेस से अपना डेटा सूचीबद्ध कर सकूं। क्या ऐसा करना संभव है या ऐसा करने के कोई अन्य तरीके हैं? मैंने पूरे दिन यह कोशिश की थी और उम्मीद अब ठीक हो सकती है।

यह मेरा JSON है:

{"-M1ytAolVL1xdnO0dXjD": {"Favourite": false, "ItemIdentity": "Qjwj", "ItemName": "Sjsj", "ItemQuantity": "1"}, "-M1ytGOJD62TwwEWOmMu": {"Favourite": true, "ItemIdentity": "This is my thing", "ItemName": "Acer laptop", "ItemQuantity": "12"}}

यह मेरा फ्लैटलिस्ट कोड है:

    render() {
        console.log(this.state.retrieveData.id)
        return (
            <View>
                <Text>A</Text>   
                    <FlatList data={this.state.retrieveData}
                        renderItem={({ item }) => (
                            <ListItem title={item.Favourite} />
                        )}
                    >
                        <Text>B</Text>
                    </FlatList>
            </View>
        )
    }```



0
staycalm 1998 10 मार्च 2020, 10:12
हो सकता है कि "-M1ytAolVL1xdnO0dXjD", "-M1ytGOJD62TwwEWOmMu"... इनसे छुटकारा पाएं, ताकि आपका जोंस इस तरह दिखे [{"Favorite":false, ...}, {"Favourite": true,...}]
 – 
Mark
10 मार्च 2020, 10:16
लेकिन वह firebase से अद्वितीय आईडी है
 – 
staycalm 1998
10 मार्च 2020, 10:18
1
तो आप इसे [{"id": "-M1ytAolVL1xdnO0dXjD", "पसंदीदा": असत्य,.....},...] लूप का उपयोग करके बना सकते हैं। फ्लैट-सूची केवल सरणियाँ लेगी
 – 
Mark
10 मार्च 2020, 10:21

3 जवाब

फ्लैटलिस्ट के लिए इसका उपयोग करने के लिए आपको JSON.parse() का उपयोग करके अपने जेसन को पार्स करने की आवश्यकता है, फ्लैटलिस्ट घटक केवल सरणी स्वीकार करता है, ऑब्जेक्ट्स नहीं। यदि आप फायरबेस द्वारा लौटाए गए ऑब्जेक्ट कुंजियों को रखना चाहते हैं तो पहले अपने डेटा को स्वरूपित करने का प्रयास करें।

1
Imjaad 10 मार्च 2020, 10:20

सबसे पहले आप कच्चे JSON स्ट्रिंग को पार्स कर सकते हैं:

const rawData = JSON.parse('{"-M1ytAolVL1xdnO0dXjD": {"Favourite": false, "ItemIdentity": "Qjwj", "ItemName": "Sjsj", "ItemQuantity": "1"}, "-M1ytGOJD62TwwEWOmMu": {"Favourite": true, "ItemIdentity": "This is my thing", "ItemName": "Acer laptop", "ItemQuantity": "12"}}')

फिर मानों की सरणी में रूपांतरित करें:

const data = Object.values(rawData);
/*
// will produce 
  [
{"Favourite": false, "ItemIdentity": "Qjwj", "ItemName": "Sjsj", "ItemQuantity": "1"}, 
{"Favourite": true, "ItemIdentity": "This is my thing", "ItemName": "Acer laptop", "ItemQuantity": "12"}
]
*/

महत्वपूर्ण: आपको इसे render() के अंदर नहीं करना चाहिए। इस तरह के परिवर्तन को लाने के करीब ले जाने के लिए स्वतंत्र रूप से भरें।

और फिर रेंडर में डेटा का उपयोग करें:

render() {
        console.log(this.state.data)
        return (
            <View>
                <Text>Data</Text>   
                    <FlatList data={this.state.data}
                        renderItem={({ item }) => (
                            <ListItem title={item.Favourite} />
                        )}
                    />
            </View>
        )
    }
1
Kyr 10 मार्च 2020, 10:37

आप कुछ ऐसा कर सकते हैं -

constructor(props){
    super(props);
    this.state = {retrieveData: []};
}

componentDidMount() {
    // fetch your json here
    const json = {"-M1ytAolVL1xdnO0dXjD": {"Favourite": false, "ItemIdentity": "Qjwj", "ItemName": "Sjsj", "ItemQuantity": "1"}, "-M1ytGOJD62TwwEWOmMu": {"Favourite": true, "ItemIdentity": "This is my thing", "ItemName": "Acer laptop", "ItemQuantity": "12"}};
    const list = [];
    for(const k in json) {
      list.push({
        id: k,
        ...json[k],
      })
    }
    this.setState({retrieveData: list});
}

फिर

render() {
        return (
            <View>
                <Text>A</Text>   
                    <FlatList data={this.state.retrieveData}
                        renderItem={({ item }) => (
                            <ListItem title={item.Favourite} />
                        )}
                    >
                        <Text>B</Text>
                    </FlatList>
            </View>
        )
    }
1
Mark 10 मार्च 2020, 10:30