আপনার অ্যাপ ডেভেলপ করার সময় আপনি উপরে উল্লিখিত ত্রুটি জুড়ে আসতে পারেন। এখানে কোড যা ত্রুটি দেয় −
উদাহরণ
import React from "react";
import { Image , Text, View, StyleSheet } from "react-native";
export default class App extends React.Component {
render() {
return (
<View style={styles.container}>
<Image
style={styles.stretch}
source={{
uri:
'https://pbs.twimg.com/profile_images/486929358120964097/gNLINY67_400x400.png ',
}}
/>
</View>
);
}
}
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 (
<View style={styles.container}>
<Image style={styles.stretch} source={{uri:
'https://pbs.twimg.com/profile_images/486929358120964097/gNLINY67_400x400.png
'}} />
</View>
);
}
}
const styles = StyleSheet.create({
container: {
paddingTop: 50,
paddingLeft: 50,
},
stretch: {
width: 200,
height: 200,
resizeMode: 'stretch',
}
}); আউটপুট
