क्यों रिएक्ट हुक का उपयोग करता है कास्ट का उपयोग करता है और न जाने क्या


33

रिएक्ट का उपयोग करने का मानक तरीकाState हुक निम्नलिखित है:

const [count, setCount] = useState(0);

हालांकि यह const countचर स्पष्ट रूप से एक अलग आदिम मूल्य के लिए पुन: सौंपा जा रहा है।

फिर चर को क्यों नहीं परिभाषित किया गया है let count?


5
यदि आप राज्य को बदलते हैं, तो घटक स्पष्ट रूप से सही रेंडर करेगा? इसलिए यदि यह फिर से प्रस्तुत करता है तो गिनती कभी भी "
आश्वस्त

3
दरअसल, फंक्शन काउंट के दायरे में अकुशलता रहती है। धन्यवाद केविन!
नाचो

जवाबों:


46

स्पष्ट रूप से एक अलग आदिम मूल्य के लिए आश्वस्त होने जा रहा है

ज़रुरी नहीं। जब घटक को फिर से जोड़ा जाता है, तो फ़ंक्शन को फिर से निष्पादित किया जाता है, एक नया दायरा बनाता है, एक नया countचर बनाता है, जिसका पिछले चर के साथ कोई लेना-देना नहीं है।

उदाहरण:

let _state;
let _initialized = false;
function useState(initialValue) {
  if (!_initialized) {
    _state = initialValue;
    _initialized = true;
  }
  return [_state, v => _state = v];
}

function Component() {
  const [count, setCount] = useState(0);

  console.log(count);
  setCount(count + 1);
}

Component();
Component(); // in reality `setCount` somehow triggers a rerender, calling Component again
Component(); // another rerender

नोट: हुक अधिक परिष्कृत हैं और वास्तव में इस तरह लागू नहीं होते हैं। यह सिर्फ एक समान व्यवहार प्रदर्शित करने के लिए है।


2

const एक ही दायरे के भीतर संदर्भ के मूल्य को फिर से सौंपने के खिलाफ एक गार्ड है।

से MDN

इसका मतलब यह नहीं है कि यह जो मूल्य रखता है वह अपरिवर्तनीय है, बस यह कि चर पहचानकर्ता को आश्वस्त नहीं किया जा सकता है।

भी

एक स्थिरांक किसी फ़ंक्शन या चर के साथ एक ही दायरे में अपना नाम साझा नहीं कर सकता है।


1
हालांकि, आदिम मूल्य अपरिवर्तनीय हैं, इसलिए यह समझाने के बारे में सवाल अधिक है कि एक संख्‍या कैसे बदल सकती है?
फ्रेड स्टार्क

0

सेट-कॉलिंग के बाद घटक को फिर से जोड़ा जाता है और उपयोग की नई कॉल नए मूल्य को लौटाती है। बात यह है कि गिनती अपरिवर्तनीय है। तो यहाँ कोई टाइपो नहीं है।

तकनीकी तौर पर यह हर रेंडर में एक नया वैरिएबल है।

स्रोत: प्रतिक्रिया गितुब मुद्दा: डॉक्स - हुक: क्या वह एक टाइपो है?


0

यहाँ मैंने पाया कि कास्ट निराशाजनक था क्योंकि गिनती को बदलने की आवश्यकता है

  let [count, setCount] = useState(0)
  // simply can't use ++ on either side of count increment given we declare as const [count, setCount] 
  // instead declaration of var or let [count, setCount] allows simpler code
  const increment = () => {
    setCount(count++); //const cannot do this only let or var
  };
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.