रेडक्स में सेलेक्टर्स और useSelector हुक

पिछले पाठों में हमने स्टोर में उत्पादों का डेटा दर्ज किया था। हम इसे स्टोर से कैसे प्राप्त करें?

ऐसा करने के लिए, हमें एक फ़ंक्शन-सेलेक्टर लिखने की आवश्यकता है। यह फ़ंक्शन जानता है कि स्टोर में संग्रहीत स्टेट मान से जानकारी का एक विशिष्ट हिस्सा कैसे निकाला जाए और एप्लिकेशन के बढ़ने पर दोहराए जाने वाले कोड को लिखने से बचने में मदद करता है। इनपुट के रूप में यह फ़ंक्शन state लेता है, और आउटपुट के रूप में स्टेट का आवश्यक स्लाइस देता है। उदाहरण के लिए:

jsxconst selectValue = state => state.some.value

ट्यूटोरियल की शुरुआत में उल्लेख किया गया था कि स्टोर में getState विधि है। और हम आसानी से स्टेट का मान प्राप्त करने के लिए इसका उपयोग कर सकते थे:

jsxconst value = selectValue(store.getState())

समस्या यह है कि हमारे React घटक सीधे स्टोर तक नहीं पहुंच सकते, क्योंकि इसे घटक फ़ाइल में आयात करने की अनुमति नहीं है। लेकिन हमारे पास React-Redux हुक useSelector की मदद से घटक में डेटा प्राप्त करने की क्षमता है। इसके अलावा, इस हुक के साथ, हमारे घटकों को हमेशा केवल अद्यतन डेटा ही प्राप्त होगा:

jsxconst count = useSelector(selectValue)