React Native में "Text strings must be rendered within a <Text> component" त्रुटि को कैसे हैंडल करें

अपना ऐप विकसित करते समय आप ऊपर बताई गई त्रुटि का सामना कर सकते हैं। यहां वह कोड है जो त्रुटि देता है:

उदाहरण

import React from "react";
import { Image , Text, View, StyleSheet } from "react-native";
export default class App extends React.Component {
    render() {
        return (
            
                
            
        );
    }
}
const styles = StyleSheet.create({
    container: {
        paddingTop: 50,
        paddingLeft: 50,
    },
    stretch: {
        width: 200,
        height: 200,
        resizeMode: 'stretch',
    },
});

स्क्रीन पर प्रदर्शित त्रुटि इस प्रकार है:

त्रुटि निम्नलिखित कारणों से आती है। अपने ऐप में कोडिंग करते समय उन गलतियों से बचना सुनिश्चित करें।

त्रुटि का पहला कारण खराब इंडेंटेशन है। यह बहुत आवश्यक है कि प्रत्येक कंपोनेंट ठीक से इंडेंटेड हो। चाइल्ड एलिमेंट्स पैरेंट कंपोनेंट के अंदर ठीक से इंडेंटेड हैं।

दूसरा मामला प्रत्येक कंपोनेंट के अंत में छोड़े गए स्पेस के कारण है। स्क्रीन के अंत से स्पेस हटाएं और फिर से कंपाइल करें। यह ठीक काम करेगा। किसी अन्य स्रोत से कोड कॉपी-पेस्ट करते समय सावधान रहें। आप ज्यादातर उन मामलों में इस त्रुटि का सामना करेंगे।

आइए अब कोड को सही करें और आउटपुट को फिर से जांचें।

उदाहरण

import React from "react";
import { Image , Text, View, StyleSheet } from "react-native";
export default class App extends React.Component {
    render() {
        return (
            
                
            
        );
    }
}
const styles = StyleSheet.create({
    container: {
        paddingTop: 50,
        paddingLeft: 50,
    },
    stretch: {
        width: 200,
        height: 200,
        resizeMode: 'stretch',
    },
});

आउटपुट