मुखपृष्ठ > प्रोग्रामिंग > प्रतिक्रिया में DOM तत्वों का चयन कैसे करें: `document.getElementById()` का विकल्प?
प्रतिक्रिया में DOM तत्वों का चयन कैसे करें: `document.getElementById()` का विकल्प?
2024-12-22 को प्रकाशित
ब्राउज़ करें:335
रिएक्ट में DOM एलिमेंट का चयन कैसे करें? React
में document.getElementById() का समतुल्य क्या है? रिएक्ट में, वेनिला जावास्क्रिप्ट के साथ काम करने के विपरीत, सीधे DOM तत्वों तक पहुंचना अलग है। रिएक्ट वास्तविक DOM को कुशलतापूर्वक अपडेट करने के लिए एक वर्चुअल DOM का उपयोग करता है, यह इसे वेनिला जावास्क्रिप्ट से अलग बनाता है। &&&]
फ़ंक्शन घटकों के साथ Refs का उपयोग करें:(v16.8.0)उपयोग करें उपयोग रेफरी और फॉरवर्ड रेफरी। रेफरी को यूज़रेफ के साथ परिभाषित करें और फिर इसे फॉरवर्डरेफ का उपयोग करके डीओएम तत्व पर अग्रेषित करें। तत्व तक पहुंचने के लिए, रेफरी (रेफरी करंट) की वर्तमान संपत्ति का उपयोग करें। ]React.createRef() का उपयोग करके एक रेफरी बनाएं और बाद में इसे एक्सेस करने के लिए इसे एक तत्व से संलग्न करें। DOM नोड प्राप्त करने के लिए ref.current का उपयोग करें। तत्व और एक कॉलबैक फ़ंक्शन पास करें जो DOM तत्व का संदर्भ प्राप्त करता है।
- विकल्प 4: स्ट्रिंग रेफरी का उपयोग करना (विरासत)
उदाहरण
- नीचे DOM तत्व का चयन करने के लिए कॉलबैक पैटर्न का उपयोग करने का एक उदाहरण दिया गया है:
- रेंडर () {
वापस करना (
तत्वों तक पहुंचने के लिए, आप उन पर संचालन करने के लिए this.progressBars[0], this.progressBars[1], और this.progressBars[2] का उपयोग कर सकते हैं।
नवीनतम ट्यूटोरियल
अधिक>
-
MacOS पर Django में \"अनुचित कॉन्फ़िगर: MySQLdb मॉड्यूल लोड करने में त्रुटि\" को कैसे ठीक करें?MySQL अनुचित रूप से कॉन्फ़िगर किया गया: सापेक्ष पथों के साथ समस्याDjango में Python मैनेज.py runserver चलाते समय, आपको निम्न त्रुटि का सामना करना पड़ ...प्रोग्रामिंग 2024-12-23 को प्रकाशित -
मैं जावा स्ट्रिंग में एकाधिक सबस्ट्रिंग को कुशलतापूर्वक कैसे बदल सकता हूं?जावा में एक स्ट्रिंग में एकाधिक सबस्ट्रिंग को कुशलतापूर्वक बदलनाजब एक स्ट्रिंग के भीतर कई सबस्ट्रिंग को बदलने की आवश्यकता का सामना करना पड़ता है, तो य...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
सरणीतरीके एफएनएस हैं जिन्हें ऑब्जेक्ट पर कॉल किया जा सकता है ऐरे ऑब्जेक्ट हैं, इसलिए जेएस में उनके तरीके भी हैं। स्लाइस (शुरू): मूल सरणी को बदले ब...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
जेएस और मूल बातेंजावास्क्रिप्ट और प्रोग्रामिंग फंडामेंटल के लिए एक शुरुआती मार्गदर्शिका जावास्क्रिप्ट (जेएस) एक शक्तिशाली और बहुमुखी प्रोग्रामिंग भाषा है जिसका उपयोग म...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
मैं MySQL का उपयोग करके आज के जन्मदिन वाले उपयोगकर्ताओं को कैसे ढूँढ सकता हूँ?MySQL का उपयोग करके आज के जन्मदिन वाले उपयोगकर्ताओं की पहचान कैसे करेंMySQL का उपयोग करके यह निर्धारित करना कि आज उपयोगकर्ता का जन्मदिन है या नहीं, इस...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
डेटा डालते समय ''सामान्य त्रुटि: 2006 MySQL सर्वर चला गया है'' को कैसे ठीक करें?रिकॉर्ड सम्मिलित करते समय "सामान्य त्रुटि: 2006 MySQL सर्वर चला गया है" को कैसे हल करेंपरिचय:MySQL डेटाबेस में डेटा डालने से कभी-कभी त्रुटि ...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
जावास्क्रिप्ट ऑब्जेक्ट्स में कुंजी को गतिशील रूप से कैसे सेट करें?जावास्क्रिप्ट ऑब्जेक्ट वेरिएबल के लिए डायनामिक कुंजी कैसे बनाएंजावास्क्रिप्ट ऑब्जेक्ट के लिए डायनामिक कुंजी बनाने का प्रयास करते समय, इस सिंटैक्स का उ...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
वैध कोड के बावजूद पोस्ट अनुरोध PHP में इनपुट कैप्चर क्यों नहीं कर रहा है?PHP में POST अनुरोध की खराबी को संबोधित करनाप्रस्तुत कोड स्निपेट में:action=''इरादा टेक्स्ट बॉक्स से इनपुट कैप्चर करना और सबमिट बटन पर क्लिक करने पर इ...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
PHP के फ़ंक्शन पुनर्परिभाषा प्रतिबंधों पर कैसे काबू पाएं?PHP की फ़ंक्शन पुनर्परिभाषा सीमाओं पर काबू पानाPHP में, एक ही नाम के साथ एक फ़ंक्शन को कई बार परिभाषित करना एक नो-नो है। ऐसा करने का प्रयास करने पर, ज...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
क्या गो प्रारंभिक मानक इनपुट स्ट्रीम तक पहुंच सकता है?गो में, क्या आप प्रारंभिक मानक इनपुट तक पहुंच सकते हैं?गो में, मूल मानक इनपुट से पढ़ने के लिए os.Stdin का उपयोग करने से वांछित परिणाम प्राप्त होने चाह...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
`if` कथनों से परे: स्पष्ट `bool` रूपांतरण वाले प्रकार को कास्टिंग के बिना और कहाँ उपयोग किया जा सकता है?बूल में प्रासंगिक रूपांतरण बिना किसी कास्ट के स्वीकृतआपकी कक्षा बूल में एक स्पष्ट रूपांतरण को परिभाषित करती है, जिससे आप सीधे सशर्त बयानों में इसके उद...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
मैं अद्वितीय आईडी को संरक्षित करते हुए और डुप्लिकेट नामों को संभालते हुए PHP में दो सहयोगी सरणियों को कैसे जोड़ूं?PHP में एसोसिएटिव एरेज़ का संयोजनPHP में, दो एसोसिएटिव एरेज़ को एक ही एरे में संयोजित करना एक सामान्य कार्य है। निम्नलिखित अनुरोध पर विचार करें:समस्या...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
एक न्यूनतम पासवर्ड प्रबंधक डेस्कटॉप ऐप: गोलांग के वेल्स फ्रेमवर्क में एक प्रयास (भाग 2)Hi again, coders! In the first part of this short series we saw the creation and operation of a desktop application to store and encrypt our passwords...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
ES6 प्रतिक्रिया घटक: वर्ग-आधारित बनाम कार्यात्मक का उपयोग कब करें?ईएस6 क्लास-आधारित और कार्यात्मक ईएस6 रिएक्ट घटकों के बीच निर्णय लेनारिएक्ट के साथ काम करते समय, डेवलपर्स को ईएस6 क्लास-आधारित का उपयोग करने के बीच विक...प्रोग्रामिंग 2024-12-23 को प्रकाशित
-
मैं PHP में दो फ्लैट सरणियों के बीच अद्वितीय मान कैसे पा सकता हूं?फ्लैट सरणियों के बीच अद्वितीय मान ढूँढनादो सरणियों को देखते हुए, कार्य उन मूल्यों को निर्धारित करना है जो उनमें से केवल एक में मौजूद हैं। इस ऑपरेशन को...प्रोग्रामिंग 2024-12-23 को प्रकाशित
चीनी भाषा का अध्ययन करें
- 1 आप चीनी भाषा में "चलना" कैसे कहते हैं? #का चीनी उच्चारण, #का चीनी सीखना
- 2 आप चीनी भाषा में "विमान ले लो" कैसे कहते हैं? #का चीनी उच्चारण, #का चीनी सीखना
- 3 आप चीनी भाषा में "ट्रेन ले लो" कैसे कहते हैं? #का चीनी उच्चारण, #का चीनी सीखना
- 4 आप चीनी भाषा में "बस ले लो" कैसे कहते हैं? #का चीनी उच्चारण, #का चीनी सीखना
- 5 चीनी भाषा में ड्राइव को क्या कहते हैं? #का चीनी उच्चारण, #का चीनी सीखना
- 6 तैराकी को चीनी भाषा में क्या कहते हैं? #का चीनी उच्चारण, #का चीनी सीखना
- 7 आप चीनी भाषा में साइकिल चलाने को क्या कहते हैं? #का चीनी उच्चारण, #का चीनी सीखना
- 8 आप चीनी भाषा में नमस्ते कैसे कहते हैं? 你好चीनी उच्चारण, 你好चीनी सीखना
- 9 आप चीनी भाषा में धन्यवाद कैसे कहते हैं? 谢谢चीनी उच्चारण, 谢谢चीनी सीखना
- 10 How to say goodbye in Chinese? 再见Chinese pronunciation, 再见Chinese learning
