React: एकाधिक का चयन करें - चयनित आइटम (आइटम) पर स्क्रॉल न करें

पेचीदा! मुझे आश्चर्य है कि अगर रिएक्ट 16.0 में चयनित आइटम को कैसे असाइन किया गया था, इसमें कोई बदलाव हुआ है।

मैंने इन फाइलों पर एक नज़र डालने की कोशिश की:

- https://github.com/facebook/react/blob/v15.6.2/src/renderers/dom/client/wrappers/ReactDOMSelect.js

- https://github.com/facebook/react/blob/master/packages/react-dom/src/client/ReactDOMFiberSelect.js

अफसोस की बात है कि मैं इतना अंतर नहीं पा सका। (मेरी मदद की कमी के लिए क्षमा करें, लेकिन मुझे यह देखने में दिलचस्पी है कि यह कैसे हल किया जाएगा या अगर मैं गलत जगह देख रहा था)।

कोई चिंता नहीं! वे पहले स्थान हैं जिन्हें मैं भी देखूंगा। एक अंतर जो मैं देख रहा हूं वह यह है कि रिएक्ट 16.x defaultSelected बाद selected defaultSelected प्रदान करता है:

https://github.com/facebook/react/blob/master/packages/react-dom/src/client/ReactDOMFiberSelect.js#L95

मुझे आश्चर्य है कि अगर यह रिएक्ट फेंक रहा है। मैं इस समय खुद का परीक्षण करने में सक्षम नहीं हूं, लेकिन मुझे आश्चर्य है कि यदि आप एक ब्रेकपॉइंट सेट करते हैं और इस लूप के माध्यम से कदम रखते हैं तो आपको एक स्क्रॉल परिवर्तन दिखाई देगा।

नमस्ते नाथन, मैं कुछ घंटों के लिए इस मुद्दे को खोज रहा हूं, मैंने 15.6.2 और 16.3.2 पर प्रतिक्रिया स्थापित की है, मैं कुछ ब्रेकप्वाइंट के साथ कार्यक्रम के निष्पादन का पालन करने में सक्षम था, यह फ़ंक्शन की तरह लगता है:

updateOptions

इसके एक विकल्प को "सही" (अच्छे) के साथ चुनता है, यह भी सही है कि सिलेक्टेडइन्डेक्स 4 (भी अच्छा) पर सेट है, लेकिन यहाँ से मैं यह नहीं देख पा रहा हूँ कि तत्व को उस तरीके से प्रिंट नहीं करना चाहिए, क्योंकि उसके पैरामीटर ठीक लगता है। इसके अलावा मैंने defaultSelected से पहले selected defaultSelected असाइन करने में कोई अंतर नहीं देखा।

जब मैंने इसे डिबगर selected और defaultSelected (जिस पर आप उपयोग करते हैं) के माध्यम से दोनों सही ढंग से true उचित <option> DOM तत्व पर उपलब्ध विशेषताओं के रूप में चलाया। ।

16.3.2 उदाहरण में यह अभी भी पारित मूल्य का चयन करता है, यह सिर्फ इसे स्क्रॉल नहीं करता है। रेंडर में देखने के लिए कहीं और होगा जहां उस मूल्य विशेषता का आकलन / जांच की जाती है और व्यवहार बदल रहा है? मैं चारों ओर खड़ा था, लेकिन कोड के माध्यम से पार्स करने के लिए बहुत कुछ है।

यह निश्चित नहीं है कि यह कितना मदद करता है, लेकिन मैंने रिएक्ट के निर्माण को खोजने के लिए आपूर्ति की गई लिंक @ kre0n का उपयोग करके एक छोटा परीक्षण किया, जहां पहली बार समस्या होने लगी थी। परीक्षण करने के लिए, मैंने कोडैंडबॉक्स पर इंटरफ़ेस का उपयोग करके प्रतिक्रिया के प्रत्येक संस्करण को अनइंस्टॉल और पुनः इंस्टॉल किया।

मैंने जो कुछ भी देखा, उसमें से और 16.0.0 की रिहाई के बाद इस मुद्दे के होने का कारण बना। यह जानकर कि १५.६.२ काम कर रहा था, मैंने निर्णय लिया कि सभी रिलीज से पहले १६.०.०-अल्फ़ा से अग्रणी बनाता है जब तक कि इस मुद्दे पर पहली शुरुआत नहीं हुई।

मैंने पाया कि 16.0.0-अल्फा.3 के निर्माण में चुनिंदा तत्व को दिए गए 'मान' को स्क्रॉल करना बंद कर दिया गया था।

मैंने परीक्षण नहीं किया था अगर यह बाद के निर्माण में तय किया गया था, लेकिन मुझे लगा कि असफलता का पहला बिंदु किसी तरह से मदद कर सकता है।

नमस्कार। मुझे लगता है कि मैंने पहचान लिया कि इस तरह के अवांछित व्यवहार का क्या कारण है, लेकिन, मुझे एक उचित निर्धारण की जांच के लिए कुछ और समय चाहिए। इसलिए, अगर किसी को कोई आपत्ति नहीं है, तो मैं इस मुद्दे को उठाना चाहूंगा और अपनी पहली प्रतिबद्धता परियोजना में करूंगा।

अपडेट करें। ऐसा प्रतीत होता है कि जैसा मैंने सोचा है उससे यह मुद्दा थोड़ा अधिक जटिल है। मुझे यकीन है कि यह व्यवहार रिएक्शन फाइबर आर्किटेक्चर के साथ पेश किया गया है। मैं इसे ठीक करने की कोशिश करता रहूंगा, हालांकि मुझे नहीं पता कि इसमें कितना समय लग सकता है। जैसा कि मुझे पहले कार्यान्वयन विवरण में नहीं मिला था, इसमें कुछ समय लग सकता है

माफ़ करना। मैं बहुत यात्रा कर रहा हूं :) लगता है कि यह वास्तव में कठिन मुद्दा है।

@segoddnja मैं इसे आपको सौंप दूंगा, लेकिन अपने दम पर इस पर बहुत समय जलाने का कोई दबाव नहीं। आइए एक परिकल्पना का पता लगाने की कोशिश करें और शायद हम इसे हल करने के लिए मिलकर काम कर सकते हैं।

मुझे उत्सुकता है अगर कुछ समय से पहले चयन करने के लिए हो रहा है जिससे स्क्रॉलिंग बंद हो सकती है। मुझे आश्चर्य है कि अगर संपत्ति / विशेषता असाइनमेंट का क्रम होता है जो बदल सकता था जो स्क्रॉलिंग स्टॉप को जन्म देगा।

यहाँ एक दिलचस्प घटना है, मान लें कि निम्न चरण होते हैं:

https://codepen.io/nhunzaker/pen/vaZxvE

1. 6 विकल्प दिए
2. आप पहला विकल्प चुनें
3. आप 6 वाँ विकल्प चुनें
4. आप पहले विकल्प को अचयनित करते हैं

स्क्रॉलिंग अभी भी पहले विकल्प पर केंद्रित है, भले ही 6 वां विकल्प केवल एक ही चुना गया हो।

ऐसा प्रतीत होता है कि, क्रोम वैसे भी, केवल पहले चयनित मान पर स्क्रॉल करता है जब _assigned_, _unignedign नहीं।

शायद यह संबंधित है।

@ यंगज़ेकर हां, धन्यवाद, आप सही दिशा में सोचते हैं। ब्राउज़र पहले विकल्प पर स्क्रॉल करता है जिसे चयनित संपत्ति सही मिली। कोई और परिवर्तन स्क्रॉल का कारण नहीं बनता है।

तो, मैंने अब क्या खोजा है। React नंगे selest नोड बनाता है और इसके लिए विकल्प जोड़ता है। जैसा कि नंगे select का multipe=false , पहले जोड़ा गया विकल्प स्वचालित रूप से selected=true हो जाता है। इसलिए आगे कई मोड में स्विच करने और विकल्प चयन को अपडेट करने से यह स्क्रॉल करने का कारण नहीं बनता है।

मुझे लगता है कि विकल्प चुनने से पहले multiple विशेषता मान सेट करना आवश्यक है।