रिएक्ट बनाम रिएक्टम?


197

मैं प्रतिक्रिया करने के लिए थोड़ा नया हूं। मैं देख रहा हूं कि शुरुआत करने के लिए हमें दो चीजों का आयात करना होगा, Reactऔर ReactDOMक्या कोई अंतर समझा सकता है। मैं रिएक्ट प्रलेखन के माध्यम से पढ़ रहा हूं , लेकिन यह नहीं कहता है।

जवाबों:


251

React और ReactDOM को हाल ही में दो अलग-अलग पुस्तकालयों में विभाजित किया गया था। V0.14 से पहले, सभी ReactDOM कार्यक्षमता प्रतिक्रिया का हिस्सा थी। यह भ्रम का एक स्रोत हो सकता है, क्योंकि किसी भी दिनांकित दस्तावेज़ में रिएक्ट / रिएक्टडोम भेद का उल्लेख नहीं होगा।

जैसा कि नाम से ही स्पष्ट है, ReactDOM, React और DOM के बीच का गोंद है। अक्सर, आप केवल एक ही चीज़ के लिए इसका उपयोग करेंगे: साथ बढ़ते ReactDOM.render()। ReactDOM की एक अन्य उपयोगी विशेषता यह है ReactDOM.findDOMNode()कि आप एक DOM तत्व तक सीधी पहुँच प्राप्त करने के लिए उपयोग कर सकते हैं। (कुछ आपको रिएक्ट ऐप्स में संयम से उपयोग करना चाहिए, लेकिन यह आवश्यक हो सकता है।) यदि आपका ऐप "आइसोमॉर्फिक" है, तो आप ReactDOM.renderToString()अपने बैक-एंड कोड में भी उपयोग करेंगे ।

बाकी सब के लिए, वहाँ प्रतिक्रिया है। आप अपने तत्वों को परिभाषित करने और बनाने के लिए रिएक्ट का उपयोग करते हैं, जीवनचक्र के हुक के लिए, आदि यानी रिएक्ट एप्लिकेशन की हिम्मत।

कारण और प्रतिक्रिया ReactDOM को दो पुस्तकालयों में विभाजित किया गया था, जो प्रतिक्रिया मूल के आने के कारण था। प्रतिक्रिया में वेब और मोबाइल एप्लिकेशन में उपयोग की जाने वाली कार्यक्षमता शामिल है। ReactDOM कार्यक्षमता का उपयोग केवल वेब एप्लिकेशन में किया जाता है। [ अद्यतन: आगे के शोध के अनुसार, यह स्पष्ट है कि रिएक्ट नेटिव की मेरी अज्ञानता दिख रही है। वेब और मोबाइल दोनों के लिए रिएक्ट पैकेज कॉमन होना एक वास्तविकता की तुलना में एक आकांक्षा से अधिक प्रतीत होता है। रिएक्ट नेटिव वर्तमान में एक पूरी तरह से अलग पैकेज है।]

V0.14 रिलीज की घोषणा करने वाली ब्लॉग पोस्ट देखें: https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html


53

से प्रतिक्रिया v0.14 बीटा रिलीज़ घोषणा

हम जैसे संकुल को देखने के रूप में react-native, react-art, react-canvas, और react-three, यह स्पष्ट हो रहा है सौंदर्य और का सार प्रतिक्रिया है कि ब्राउज़र या डोम के साथ कोई संबंध नहीं है।

इसे और अधिक स्पष्ट करने के लिए और अधिक वातावरण बनाने में आसान बनाने के लिए जो रिएक्ट को प्रस्तुत कर सकता है, हम मुख्य प्रतिक्रिया पैकेज को दो में विभाजित कर रहे हैं: प्रतिक्रिया और प्रतिक्रिया-डोम।

मौलिक रूप से, रिएक्ट के विचार का ब्राउज़रों के साथ कोई लेना-देना नहीं है, वे सिर्फ घटकों के पेड़ों को प्रस्तुत करने के लिए कई लक्ष्यों में से एक होते हैं। ReactDOM पैकेज ने डेवलपर्स को रिएक्ट पैकेज से किसी भी गैर-आवश्यक कोड को हटाने और इसे अधिक उपयुक्त रिपॉजिटरी में स्थानांतरित करने की अनुमति दी है।

reactपैकेज में शामिल है React.createElement, React.createClassऔर React.Component, React.PropTypes, React.Children, और अन्य तत्वों और घटक वर्गों से संबंधित सहायकों। हम इन्हें आइसोमोर्फिक या सार्वभौमिक हेल्पर्स के रूप में सोचते हैं जिन्हें आपको घटकों के निर्माण की आवश्यकता है।

react-domपैकेज में शामिल है ReactDOM.render, ReactDOM.unmountComponentAtNodeऔर ReactDOM.findDOMNode, और में react-dom/serverहम साथ सर्वर साइड प्रतिपादन समर्थन ReactDOMServer.renderToStringऔर ReactDOMServer.renderToStaticMarkup

ये दो पैराग्राफ बताते हैं कि कहां से कोर एपीआई तरीके v0.13समाप्त हो गए।


6
प्रतिक्रिया के रूप में v15.4.0 प्रतिक्रिया अब नहीं है ReactDOM- facebook.github.io/react/blog/2016/11/16/react-v15.4.0.html
Rycochet

प्रतिक्रिया में शामिल नहीं होने पर React.PropTypes, proptypes के पास स्वयं का भंडार है, जिसका नाम 'प्रोप-टाइप' है
ncubica

6

V0.14 से पहले वे मुख्य ReactJs फ़ाइल का हिस्सा थे, लेकिन जैसा कि कुछ मामलों में हमें दोनों की आवश्यकता नहीं हो सकती है, वे उन्हें अलग करते हैं और यह संस्करण 0.14 से शुरू होता है, इस तरह अगर हमें उनमें से केवल एक की आवश्यकता होती है, तो हमारा ऐप छोटा होने के कारण है उनमें से केवल एक का उपयोग करना:

var React = require('react'); /* importing react */
var ReactDOM = require('react-dom'); /* importing react-dom */

var MyComponent = React.createClass({
  render: function() {
    return <div>Hello World</div>;
  }
});

ReactDOM.render(<MyComponent />, node);

प्रतिक्रिया पैकेज में शामिल हैं: React.createElement, React.createClass, React.Component, React.PropTypes, React.Children

रिएक्ट-डोम पैकेज में शामिल हैं: ReactDOM.render, ReactDOM.unmountComponentAtNode, ReactDOM.findDOMNode, और प्रतिक्रिया-डोम / सर्वर जिसमें शामिल हैं: ReactDOMSverver.renderToString और ReactDOMServer.renderToStaticMarkup।


यह टिप्पणी मूल प्रश्न से संबंधित नहीं है, लेकिन आपके उत्तर में परिचय ('ब्लाह') की आवश्यकता है .. यह समझाने के लिए कि ब्राउजर में इसे कैसे चलाना है, इसकी आवश्यकता है, क्योंकि आवश्यकता सादे जीएस की नहीं है?
जॉडॉट्नोट

5

ReactDOM मॉड्यूल DOM-specific तरीकों को उजागर करता है, जबकि React के पास विभिन्न प्लेटफॉर्म (जैसे React Native) पर React द्वारा साझा किए जाने वाले मूल उपकरण हैं।

http://facebook.github.io/react/docs/tutorial.html


4

ऐसा लगता है कि वे रिएक्ट reactऔर react-domपैकेज में अलग हो गए हैं, इसलिए आपको उन परियोजनाओं के लिए डोम-संबंधित भाग का उपयोग करने की आवश्यकता नहीं है जहां आप इसे गैर-डोम-विशिष्ट मामलों में उपयोग करना चाहते हैं, जैसे कि यहां https: // github.com/Flipboard/react-canvas जहाँ वे आयात करते हैं

var React = require('react');
var ReactCanvas = require('react-canvas');

जैसा कि आप देख सकते हैं। बिना react-dom


3

अधिक संक्षिप्त होने के लिए, प्रतिक्रिया घटकों के लिए है और प्रतिक्रिया-डोम डोम में घटकों को प्रस्तुत करने के लिए है। 'प्रतिक्रिया-डोम' घटकों और DOM के बीच गोंद के रूप में कार्य करता है। आप DOM में कंपोनेंट्स रेंडर करने के लिए रिएक्ट-डोम के रेंडर () मेथड का इस्तेमाल कर रहे होंगे और यही सब आपको जानना होगा जब आप इसके बारे में शुरू कर रहे हैं।


0

react packageरखती react sourceघटकों, राज्य, रंगमंच की सामग्री और सभी कोड कि प्रतिक्रिया के लिए।

react-domपैकेज के रूप में नाम का तात्पर्य है glue between React and the DOM। अक्सर, आप केवल एक ही चीज़ के लिए इसका उपयोग करेंगे mounting your application to the index.html file with ReactDOM.render():।

उन्हें अलग क्यों किया?

reasonप्रतिक्रिया और ReactDOM दो पुस्तकालयों में विभाजित किया गया के आगमन की वजह से था React Native (A react platform for mobile development)

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.