React.js: क्या अभी भी जेएसएक्स का उपयोग करने के लिए बाल घटकों को नामित करना संभव है?

Question

तो चलो कहते हैं कि मैं एक घटक ImageGrid कहा जाता है और यह नीचे के रूप में परिभाषित किया गया है चलो:

window.ImageGrid = React.createClass({ 
    render: function() { 
     return (
      <div className="image-grid"> 
       <ImageGridItem /> 
      </div> 
     ); 
    } 
}); 

आप देख सकते हैं यह भी शामिल है एक बच्चे ImageGridItem बुलाया घटक प्रतिक्रिया होती है। जो नीचे परिभाषित किया गया है।

window.ImageGridItem = React.createClass({ 
    render: function() { 
     return (
      <div className="item-container">something</div> 
     ); 
    } 
}); 

यह रूप में लंबे समय के रूप में दोनों सीधे window की संपत्ति हैं ठीक काम करता है। लेकिन यह बहुत ही भयानक है इसलिए उदाहरण के लिए window.myComponents के नामस्थान के तहत मैं अपने सभी प्रतिक्रिया घटकों को समूहबद्ध करना चाहता हूं।

window.myComponents.ImageGrid  = React.createClass({...}); 
window.myComponents.ImageGridItem = React.createClass({...}); 

समस्या अब है कि के रूप में ImageGrid<ImageGridItem /> को संदर्भित करता है यह() फ़ंक्शन प्रस्तुत करना है, इस के जे एस संस्करण ImageGridItem() के रूप में जे एस के लिए बाहर संकलित हो जाता है निश्चित रूप से जो है:

तो परिभाषाओं को बदलने अपरिभाषित है क्योंकि यह वास्तव में myComponents.ImageGridItem() है और शिकायत प्रतिक्रिया करता है कि यह इसे नहीं मिल सकता है।

हाँ मुझे पता है मैं तो बस शामिल है कि घटक के लिए JSX लिख नहीं सकता और मैन्युअल myComponents.ImageGridItem({attr: 'val'}) है, लेकिन मैं वास्तव में के रूप में यह बहुत आसान पढ़ सकते हैं और साथ विकसित करने के लिए है JSX एचटीएमएल वाक्य रचना शॉर्टकट का उपयोग करना पसंद करते हैं।

क्या बच्चों के लिए <ImageGridItem /> वाक्यविन्यास का उपयोग करते हुए इसे काम करने के लिए कोई तरीका है? और यदि जेएसएक्स के भीतर जेएस नेमस्पेस को परिभाषित करना संभव नहीं है?

Answer 1

इस पुल से अनुरोध करता था सिर्फ विलय कर दिया:

https://github.com/facebook/react/pull/760

यह आप में <myComponents.ImageGridItem /> तरह बातें प्रतिक्रिया 0.11 और नए लिखने के लिए अनुमति देता है।

यह कहा गया है कि, उचित मॉड्यूल सिस्टम निर्भरता का प्रबंधन करने के लिए अनुशंसित तरीका है जो आपको आवश्यक कोड में खींचने से बचने के लिए है।

Answer 2

वर्तमान में, ऐसा करने का कोई तरीका नहीं है। जेएसएक्स के साथ नेमस्पेसिंग टोडो सूची पर है।

अधिकांश लोग किसी प्रकार की मॉड्यूल सिस्टम (ब्राउज़र, वेबपैक, requjs) का उपयोग करते हैं, जो नेमस्पेसिंग को प्रतिस्थापित करते हैं और घटकों को आसानी से उपयोग करने की अनुमति देते हैं। बहुत से अन्य लाभ हैं, इसलिए मैं इसे देखने की बहुत अनुशंसा करता हूं।