Tepki mi Tepkime mi?


198

Tepki vermek için biraz yeniyim. Başlamak için iki şeyi içe aktarmamız gerektiğini görüyorum Reactve ReactDOMherkes farkı açıklayabilir mi? React belgelerini okuyorum ama öyle değil.

Yanıtlar:


251

React ve ReactDOM sadece son zamanlarda iki farklı kütüphaneye ayrıldı. V0.14'ten önce, tüm ReactDOM işlevselliği React'in bir parçasıydı. Bu biraz karışık bir belge olabilir, çünkü biraz tarihli herhangi bir belge React / ReactDOM ayrımından bahsetmez.

Adından da anlaşılacağı gibi, ReactDOM, React ve DOM arasındaki yapıştırıcıdır. Genellikle, sadece tek bir şey için kullanırsınız: montaj ReactDOM.render(). ReactDOM'un başka bir yararlı özelliği, ReactDOM.findDOMNode()bir DOM öğesine doğrudan erişim elde etmek için kullanabileceğiniz bir özelliktir . (React uygulamalarında az miktarda kullanmanız gereken bir şey, ancak gerekli olabilir.) Uygulamanız "izomorfik" ReactDOM.renderToString()ise, arka uç kodunuzda da kullanabilirsiniz .

Diğer her şey için React var. React'i öğelerinizi tanımlamak ve oluşturmak, yaşam döngüsü kancaları vb. İçin, örneğin bir React uygulamasının bağırsakları için kullanırsınız.

React ve ReactDOM'un iki kütüphaneye ayrılmasının nedeni, React Native'ın gelişinden kaynaklanıyordu. React, web ve mobil uygulamalarda kullanılan işlevleri içerir. ReactDOM işlevselliği yalnızca web uygulamalarında kullanılır. [ GÜNCELLEME: Daha fazla araştırma yapıldığında, React Native hakkındaki cehaletimin gösterdiği açık. React paketinin hem web'de hem de mobilde ortak olması, şu an için bir gerçeklikten daha çok bir arzu gibi görünüyor. Native React şu anda tamamen farklı bir paket.]

V0.14 sürümünü açıklayan blog gönderisine bakın: https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html


53

Gönderen v0.14 Beta sürümü duyuru Tepki .

Biz gibi paketler bakarken react-native, react-art, react-canvas, ve react-threegüzellik ve özü tarayıcılar veya DOM ile ilgisi yoktur Tepki olduğu açıkça görmüştür.

Bunu daha açık hale getirmek ve React'ın oluşturabileceği daha fazla ortam oluşturmayı kolaylaştırmak için ana reaksiyon paketini ikiye ayırıyoruz: tepki ve tepki-dom.

Temel olarak, React fikrinin tarayıcılarla hiçbir ilgisi yoktur, sadece bileşen ağaçlarını oluşturmak için birçok hedeften biri olurlar. ReactDOM paketi, geliştiricilerin React paketinden gerekli olmayan herhangi bir kodu kaldırmasına ve daha uygun bir depoya taşımasına izin verdi.

reactPaketini içeren React.createElement, React.createClassve React.Component, React.PropTypes, React.Childrenve elementler ile bileşen sınıfları ile ilgili diğer yardımcılar. Bunları, bileşenler oluşturmak için ihtiyaç duyduğunuz izomorfik veya evrensel yardımcılar olarak düşünüyoruz .

react-domPaket içerir ReactDOM.render, ReactDOM.unmountComponentAtNodeve ReactDOM.findDOMNode, ve react-dom/serverbiz sunucu tarafında oluşturma desteği ReactDOMServer.renderToStringve ReactDOMServer.renderToStaticMarkup.

Bu iki paragraf temel API yöntemlerinin nereden v0.13sonlandığını açıklamaktadır .


6
React v15.4.0'dan itibaren React artık sahip değil ReactDOM- facebook.github.io/react/blog/2016/11/16/react-v15.4.0.html
Rycochet

tepki artık dahil değildir React.PropTypes, prototipler 'prop-türleri' adında kendi deposuna sahip
ncubica

6

V0.14'ten önce ana ReactJs dosyasının bir parçasıydı, ancak bazı durumlarda her ikisine de ihtiyacımız olmayabilir, onları ayırırlar ve sürüm 0.14'ten başlar, bu şekilde bunlardan sadece birine ihtiyacımız olursa, uygulamamız nedeniyle daha küçük olur bunlardan sadece birini kullanarak:

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 paketi şunları içerir: React.createElement, React.createClass, React.Component, React.PropTypes, React.Children

React-dom paketi şunları içerir: ReactDOM.render, ReactDOM.unmountComponentAtNode, ReactDOM.findDOMNode ve reat-dom / server içeren şunları içerir: ReactDOMServer.renderToString ve ReactDOMServer.renderToStaticMarkup.


Bu yorum orijinal soru ile ilgili değildir, ancak cevabınız gerektirir gerektirir ('blah') .. Gereksinim düz js olmadığı gibi, bir Tarayıcıda bu çalıştırmak için nasıl açıklamak ister misiniz?
joedotnot


4

React'i reactve react-dompaketleri ayırdıkları anlaşılıyor , bu nedenle DOM ile ilgili kısmı, DOM'daki spesifik olmayan durumlarda kullanmak istediğiniz projeler için kullanmanıza gerek yok, https: // ithal ettikleri github.com/Flipboard/react-canvas

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

gördüğün gibi. Olmadan react-dom.


3

Daha açık olmak gerekirse, tepki bileşenler içindir ve tepki-dom, bileşenleri DOM'da oluşturmak içindir. 'tepki-dom' bileşenler ve DOM arasında bir tutkal görevi görür. DOM içinde bileşenleri oluşturmak için tepki-dom'un render () yöntemini kullanacaksınız ve bununla başladığınızda bilmeniz gereken tek şey bu.


0

react packageTutan react sourceparçalar, eyalet, sahne ve isimli reaksiyona tüm kodu.

react-domAdından da anlaşılacağı gibi paketidir glue between React and the DOM. Çoğu zaman, sadece tek bir şey için kullanacağız: mounting your application to the index.html file with ReactDOM.render().

Onları neden ayırmalıyız?

reasonTepki ve ReactDOM gelişi nedeniyle oldu iki kütüphaneler bölünür React Native (A react platform for mobile development).

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.