Phản ứng vs ReactDOM?

Tôi hơi mới để phản ứng. Tôi thấy chúng ta phải nhập hai thứ để bắt đầu, Reactvà ReactDOM, bất cứ ai cũng có thể giải thích sự khác biệt. Tôi đang đọc qua tài liệu React , nhưng không nói.

React và ReactDOM chỉ mới được chia thành hai thư viện khác nhau. Trước v0,14, tất cả chức năng ReactDOM là một phần của React. Đây có thể là một nguồn gây nhầm lẫn, vì bất kỳ tài liệu hơi ngày nào sẽ đề cập đến sự khác biệt React / ReactDOM.

Như tên của nó, ReactDOM là chất kết dính giữa React và DOM. Thông thường, bạn sẽ chỉ sử dụng nó cho một điều duy nhất: gắn kết với ReactDOM.render(). Một tính năng hữu ích khác của ReactDOM là ReactDOM.findDOMNode()bạn có thể sử dụng để có quyền truy cập trực tiếp vào phần tử DOM. (Một cái gì đó bạn nên sử dụng một cách tiết kiệm trong các ứng dụng React, nhưng nó có thể cần thiết.) Nếu ứng dụng của bạn là "đẳng cấu", bạn cũng sẽ sử dụng ReactDOM.renderToString()mã back-end của mình.

Đối với mọi thứ khác, có React. Bạn sử dụng React để xác định và tạo các phần tử của mình, cho móc vòng đời, v.v. tức là can đảm của ứng dụng React.

Lý do React và ReactDOM được chia thành hai thư viện là do sự xuất hiện của React Native. React chứa chức năng được sử dụng trong các ứng dụng web và di động. Chức năng ReactDOM chỉ được sử dụng trong các ứng dụng web. [ CẬP NHẬT: Sau khi nghiên cứu sâu hơn, rõ ràng sự thiếu hiểu biết của tôi về React Native đang hiển thị. Có gói React chung cho cả web và di động dường như là một khát vọng hơn là thực tế ngay bây giờ. React Native hiện tại là một gói hoàn toàn khác.]

Xem bài đăng trên blog thông báo phát hành v0,14: https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html

Từ thông báo phát hành React v0.14 Beta .

Như chúng ta nhìn vào gói thích react-native, react-art, react-canvas, vàreact-three , nó trở nên rõ ràng rằng vẻ đẹp và tinh hoa của Phản ứng không có gì để làm với các trình duyệt hoặc DOM.

Để làm cho điều này rõ ràng hơn và để dễ dàng xây dựng nhiều môi trường hơn mà React có thể kết xuất, chúng tôi chia gói phản ứng chính thành hai: phản ứng và phản ứng-dom.

Về cơ bản, ý tưởng về React không liên quan gì đến các trình duyệt, chúng chỉ là một trong nhiều mục tiêu để kết xuất cây thành phần. Gói ReactDOM đã cho phép các nhà phát triển loại bỏ bất kỳ mã không cần thiết nào khỏi gói React và chuyển nó vào một kho lưu trữ phù hợp hơn.

Các reactgói chứa React.createElement, React.createClassvà React.Component, React.PropTypes, React.Children, và những người giúp việc khác liên quan đến các yếu tố và các lớp học phần. Chúng tôi nghĩ về những điều này như là đẳng cấu hoặc phổ quát người trợ giúp mà bạn cần để xây dựng các thành phần.

Các react-domgói chứa ReactDOM.render, ReactDOM.unmountComponentAtNodevà ReactDOM.findDOMNode, và react-dom/serverchúng tôi có hỗ trợ server-side vẽ với ReactDOMServer.renderToStringvà ReactDOMServer.renderToStaticMarkup.

Hai đoạn này giải thích các phương thức API cốt lõi từ đâu v0.13kết thúc.

Trước v0,14 chúng là một phần của tệp ReactJ chính, nhưng trong một số trường hợp chúng tôi có thể không cần cả hai, chúng tách chúng ra và bắt đầu từ phiên bản 0.14, theo cách đó nếu chúng tôi chỉ cần một trong số chúng, ứng dụng của chúng tôi sẽ nhỏ hơn do chỉ sử dụng một trong số đó:

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);

Gói React chứa: React.createEuity, React.createClass, React.Component, React.PropTypes, React.Children

Gói React-dom chứa: ReactDOM.render, ReactDOM.unmountComponentAtNode, ReactDOM.findDOMNode và Reac-dom / server bao gồm: ReactDOMServer.renderToString và ReactDOMServer.

Mô-đun ReactDOM trưng bày các phương thức dành riêng cho DOM, trong khi React có các công cụ cốt lõi dự định sẽ được React chia sẻ trên các nền tảng khác nhau (ví dụ React Native).

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

Có vẻ như họ đã tách React thành reactvà react-domcác gói, vì vậy bạn không phải sử dụng phần liên quan đến DOM cho các dự án mà bạn muốn sử dụng nó trong các trường hợp không dành riêng cho DOM, như ở đây https: // github.com/Flipboard/react-canvas nơi họ nhập

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

bạn có thể thấy. Không có react-dom.

Nói ngắn gọn hơn, phản ứng là dành cho các thành phần và Reac-dom là để hiển thị các thành phần trong DOM. 'Reac-dom' hoạt động như một chất keo giữa các thành phần và DOM. Bạn sẽ sử dụng phương thức render () của Reac-dom để kết xuất các thành phần trong DOM và đó là tất cả những gì bạn phải biết khi bạn bắt đầu với nó.

Các react packagegiữreact source thành phần, trạng thái, đạo cụ và tất cả các mã được phản ứng.

Các react-domgói như tên ngụ ý là glue between React and the DOM. Thông thường, bạn sẽ chỉ sử dụng nó cho một điều duy nhất:mounting your application to the index.html file with ReactDOM.render() .

Tại sao phải tách chúng ra?

Các reasonphản ứng và ReactDOM được chia thành hai thư viện là do sự xuất hiện của React Native (A react platform for mobile development).