फ़ाइल इनपुट और फ़ाइल डेटा पढ़ना
को संभालें, फ़ाइल मेटाडेटा पढ़ें और FileReader से छवियों का पूर्वावलोकन करें
फ़ाइल इनपुट और फ़ाइल डेटा पढ़ना, CoddyKit पर React Academy का एक निःशुल्क पाठ है। यह 4 में से 2वाँ पाठ है। आप नीचे पूरा पाठ निःशुल्क पढ़ सकते हैं—फिर अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर के साथ ब्राउज़र में इसका व्यावहारिक अभ्यास कर सकते हैं। यह React Academy सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। React Academy पाठ्यक्रम में कुल 4 पाठ शामिल हैं।
स्वागत है
फ़ाइल इनपुट तत्व
function FileInput() {
const handleChange = (e) => {
const file = e.target.files[0];
console.log(file.name, file.size, file.type);
};
return <input type="file" onChange={handleChange} />;
}फ़ाइल ऑब्जेक्ट के गुण
विशिष्ट फ़ाइल प्रकार स्वीकार करना
<input type="file" accept="image/png,image/jpeg,.pdf" />कई फ़ाइलों का चयन
<input type="file" multiple />
const files = Array.from(e.target.files);URL.createObjectURL से छवि का पूर्वावलोकन
const [preview, setPreview] = useState(null);
const handleChange = (e) => {
const file = e.target.files[0];
if (file) setPreview(URL.createObjectURL(file));
};
useEffect(() => {
return () => { if (preview) URL.revokeObjectURL(preview); };
}, [preview]);
{preview && <img src={preview} alt="Preview" />}FileReader से फ़ाइल की सामग्री पढ़ना
const reader = new FileReader();
reader.onload = (e) => setContent(e.target.result);
reader.readAsText(file);फ़ाइल आकार का सत्यापन
const MAX_SIZE = 5 * 1024 * 1024; // 5 MB
if (file.size > MAX_SIZE) {
setError('File must be under 5 MB');
return;
}फ़ाइल इनपुट साफ़ करना
const inputRef = useRef();
const clear = () => { inputRef.current.value = ''; };
<input ref={inputRef} type="file" />फ़ाइल संदर्भों को स्थिति में रखना
const [file, setFile] = useState(null);
const handleChange = (e) => setFile(e.target.files[0] || null);त्वरित जाँच
पुनरावलोकन
आगे
एआई शिक्षक के साथ React सीखें — निःशुल्क
अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।
- पाठ्यक्रम
- 88
- पाठ
- 324
अक्सर पूछे जाने वाले प्रश्न
क्या “फ़ाइल इनपुट और फ़ाइल डेटा पढ़ना” पाठ निःशुल्क है?
हाँ—“फ़ाइल इनपुट और फ़ाइल डेटा पढ़ना” का पूरा पाठ यहाँ वेब पर निःशुल्क पढ़ा जा सकता है। इंटरैक्टिव अभ्यास (अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर) करने और React Academy पाठ्यक्रम का बाकी हिस्सा अनलॉक करने के लिए CoddyKit PRO लें। React Academy पाठ्यक्रम में कुल 4 पाठ शामिल हैं।
“फ़ाइल इनपुट और फ़ाइल डेटा पढ़ना” में मैं क्या सीखूँगा?
को संभालें, फ़ाइल मेटाडेटा पढ़ें और FileReader से छवियों का पूर्वावलोकन करें आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ React Academy का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।
क्या React Academy शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?
पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर React Academy शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 4 में से 2वाँ पाठ है।
“फ़ाइल इनपुट और फ़ाइल डेटा पढ़ना” पाठ पूरा करने में कितना समय लगता है?
CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।
क्या मैं इस React Academy पाठ में कोड लिख और चला सकता हूँ?
हाँ। हर React Academy पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।
इस पाठ्यक्रम के सभी पाठ
- useRef से Uncontrolled Inputs
- फ़ाइल इनपुट और फ़ाइल डेटा पढ़ना
- Drag & Drop फ़ाइल अपलोड UI
- बैकएंड API पर फ़ाइलें अपलोड करना