রিঅ্যাক্ট বনাম রিঅ্যাক্টডোম?


196

আমি প্রতিক্রিয়া জানাতে কিছুটা নতুন। আমি দেখতে পাই যে শুরু করতে আমাদের দুটি জিনিস আমদানি করতে হবে Reactএবং ReactDOMযে কেউ পার্থক্যটি ব্যাখ্যা করতে পারে। আমি প্রতিক্রিয়া ডকুমেন্টেশনের মাধ্যমে পড়ছি , তবে এটি বলে না।

উত্তর:


250

প্রতিক্রিয়া এবং রিঅ্যাক্টডোম সম্প্রতি দুটি পৃথক গ্রন্থাগারে বিভক্ত ছিল। V0.14 এর আগে, সমস্ত ReactDOM কার্যকারিতা ছিল প্রতিক্রিয়াটির অংশ। এটি বিভ্রান্তির কারণ হতে পারে, যেহেতু কোনও সামান্য তারিখযুক্ত ডকুমেন্টেশনগুলি প্রতিক্রিয়া / রিঅ্যাক্টডোম পার্থক্য উল্লেখ করে না।

নামটি থেকে বোঝা যায়, রিঅ্যাক্টডোম হ'ল প্রতিক্রিয়া এবং ডিওএমের মধ্যে আঠালো। প্রায়শই, আপনি এটি কেবল একটি একক জিনিসের জন্য ব্যবহার করবেন: সাথে মাউন্ট ReactDOM.render()। রিঅ্যাক্টডোমের আরেকটি দরকারী বৈশিষ্ট্য হ'ল ReactDOM.findDOMNode()যা আপনি কোনও ডম উপাদানটিতে সরাসরি অ্যাক্সেস পেতে ব্যবহার করতে পারেন। (প্রতিক্রিয়া অ্যাপ্লিকেশনগুলিতে আপনার কিছুটা অল্প পরিমাণে ব্যবহার করা উচিত তবে এটি প্রয়োজনীয় হতে পারে)) যদি আপনার অ্যাপ্লিকেশনটি "আইসোমোরফিক" হয় তবে ReactDOM.renderToString()আপনি আপনার ব্যাক-এন্ড কোডটি ব্যবহার করতে পারেন ।

অন্য সব কিছুর জন্য, প্রতিক্রিয়া আছে। আপনি আপনার উপাদানগুলি সংজ্ঞায়িত করতে এবং তৈরি করতে, লাইফাইসাইকেল হুক ইত্যাদির জন্য ব্যবহার করেন ie অর্থাত্ একটি প্রতিক্রিয়া প্রয়োগের সাহস।

রিঅ্যাক্ট এবং রিঅ্যাক্টডোমকে দুটি গ্রন্থাগারে বিভক্ত করার কারণটি ছিল রিএ্যাক্ট নেটিভের আগমন। প্রতিক্রিয়াতে ওয়েব এবং মোবাইল অ্যাপ্লিকেশনগুলিতে ব্যবহৃত কার্যকারিতা রয়েছে। ReactDOM কার্যকারিতা কেবল ওয়েব অ্যাপ্লিকেশনগুলিতেই ব্যবহৃত হয়। [ আপডেট: আরও গবেষণার পরে, এটি পরিষ্কার হয় যে আমার প্রতিক্রিয়া নেটিভ সম্পর্কে অজ্ঞতা প্রদর্শন করছে। ওয়েব এবং মোবাইল উভয়ের জন্যই প্রতিক্রিয়া প্যাকেজটি উপস্থিত হওয়া এখনকার বাস্তবতার চেয়ে এক উচ্চাকাঙ্ক্ষী বলে মনে হচ্ছে। প্রতিক্রিয়া নেটিভ বর্তমানে একটি সম্পূর্ণ ভিন্ন প্যাকেজ।]

V0.14 প্রকাশের ব্লগ পোস্টটি দেখুন: https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html


52

থেকে প্রতিক্রিয়া v0.14 বিটা রিলিজ ঘোষণা

আমরা মত প্যাকেজ তাকান হিসাবে react-native, react-art, react-canvas, এবং react-three, এটা স্পষ্ট হয়ে সৌন্দর্য এবং সারাংশ প্রতিক্রিয়া যে ব্রাউজার বা করে DOM সঙ্গে কিছুই করার আছে।

এটিকে আরও স্পষ্ট করার জন্য এবং প্রতিক্রিয়াটি আরও বেশি পরিবেশ তৈরি করা সহজ করতে যাতে আমরা প্রতিক্রিয়া জানাতে পারি, আমরা মূল প্রতিক্রিয়া প্যাকেজটিকে দুটি ভাগে ভাগ করছি: প্রতিক্রিয়া এবং প্রতিক্রিয়া-ডোম।

মৌলিকভাবে, প্রতিক্রিয়া ধারণার ব্রাউজারগুলির সাথে কোনও সম্পর্ক নেই, কেবলমাত্র উপাদানগুলির গাছগুলিকে রেন্ডার করার জন্য এগুলি অনেকগুলি টার্গেটগুলির মধ্যে একটি হতে পারে। রিঅ্যাক্টডোম প্যাকেজটি বিকাশকারীদেরকে প্রতিক্রিয়া প্যাকেজ থেকে কোনও অপ্রয়োজনীয় কোড সরিয়ে এটিকে আরও উপযুক্ত ভাণ্ডারে স্থানান্তরিত করার অনুমতি দিয়েছে।

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

এই দুটি অনুচ্ছেদে ব্যাখ্যা করা হয়েছে যে কোথা থেকে মূল API পদ্ধতিগুলি v0.13শেষ হয়েছে।


6
প্রতিক্রিয়া v15.4.0 অনুসারে প্রতিক্রিয়াটির আর নেই ReactDOM- facebook.github.io/react/blog/2016/11/16/react-v15.4.0.html
রাইচোকে

React.PropTypes অন্তর্ভুক্ত দীর্ঘতর প্রতিক্রিয়া দেখায়, proptypes তাদের নিজস্ব সংগ্রহস্থলের পূর্ব-পুরুষদের রেখেছ 'proptypes'
ncubica

6

V0.14 এর আগে এগুলি মূল রিএ্যাকটিজে ফাইলগুলির অংশ ছিল, তবে কিছু ক্ষেত্রে আমাদের উভয়ের প্রয়োজন নাও হতে পারে, তারা এগুলি পৃথক করে এবং এটি 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.Comp घटक, React.PropType, React.Children

রিঅ্যাক্ট-ডোম প্যাকেজটিতে রয়েছে: রিঅ্যাক্টডোম.রেন্ডার, রিঅ্যাক্টডম.উনমাউন্টকম্পোনএটনোড, রিঅ্যাক্টডোম.ফাইন্ডডোমনোড এবং রিএ্যাক্ট-ডোম / সার্ভার যা অন্তর্ভুক্ত রয়েছে: রিঅ্যাক্টডোএমএসভার.রেন্ডারটোস স্ট্রিং এবং রিঅ্যাক্টডোএমএসভার.আরেন্ডারটোস্যাট্যাটিকর্মাকআপ up


এই মন্তব্যটি মূল প্রশ্নের সাথে সম্পর্কিত নয়, তবে আপনার উত্তরটির প্রয়োজন হয় ('বেলাহ') .. এটি ব্রাউজারে কীভাবে চালানো যায় তা ব্যাখ্যা করার জন্য যত্ন প্রয়োজন, যেমন প্রয়োজন সরল জেএস নয়?
joedotnot

5

রিঅ্যাক্টডোম মডিউলটি ডিওএম-নির্দিষ্ট পদ্ধতিগুলি উন্মোচিত করে, অন্যদিকে রিঅ্যাক্টের মূল সরঞ্জামগুলি বিভিন্ন প্ল্যাটফর্মগুলিতে প্রতিক্রিয়া ভাগ করে নেওয়ার উদ্দেশ্যে করা হয় (যেমন দেশটির প্রতিক্রিয়া)।

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

আরও সংক্ষিপ্ত হওয়ার জন্য, প্রতিক্রিয়াটি উপাদানগুলির জন্য এবং প্রতিক্রিয়া-ডোমটি ডিওমে থাকা উপাদানগুলি সরবরাহ করার জন্য। 'রিঅ্যাক্ট-ডোম' উপাদান এবং ডোমের মধ্যে আঠালো হিসাবে কাজ করে। আপনি ডিওএম-তে উপাদানগুলি রেন্ডার করতে রিঅ্যাক্ট-ডোমের রেন্ডার () পদ্ধতি ব্যবহার করবেন এবং আপনি কখন এটি শুরু করবেন তা জানতে হবে।


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)

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.