Реакт против РеактДОМ?

Я немного новичок, чтобы реагировать. Я вижу, что мы должны импортировать две вещи, чтобы начать, Reactи ReactDOMкто-нибудь может объяснить разницу. Я читаю документацию React , но она не говорит.

React и ReactDOM только недавно были разделены на две разные библиотеки. До версии v0.14 все функции ReactDOM были частью React. Это может привести к путанице, так как в любой слегка устаревшей документации не будет упоминаться различие React / ReactDOM.

Как следует из названия, ReactDOM является связующим звеном между React и DOM. Зачастую вы будете использовать его только для одной цели: с помощью ReactDOM.render(). Еще одна полезная функция ReactDOM - ReactDOM.findDOMNode()это то, что вы можете использовать для получения прямого доступа к элементу DOM. (Что-то, что вы должны экономно использовать в приложениях React, но это может быть необходимо.) Если ваше приложение «изоморфно», вы также должны использовать его ReactDOM.renderToString()в своем внутреннем коде.

Для всего остального есть React. Вы используете React для определения и создания своих элементов, для ловушек жизненного цикла и т. Д., Т. Е. Кишок приложения React.

Причина, по которой React и ReactDOM были разделены на две библиотеки, была связана с появлением React Native. React содержит функциональные возможности, используемые в веб и мобильных приложениях. Функциональность ReactDOM используется только в веб-приложениях. [ ОБНОВЛЕНИЕ: После дальнейших исследований ясно, что мое незнание React Native показывает. Наличие пакета React, общего как для сети, так и для мобильных устройств, сейчас кажется скорее стремлением, чем реальностью. React Native в настоящее время представляет собой совершенно другой пакет.]

См. Сообщение в блоге, посвященное выпуску v0.14: https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html.

Из объявления о выпуске React v0.14 Beta .

Когда мы смотрим на пакеты , такие как react-native, react-art, react-canvas, и react-three, стало ясно , что красота и суть Реагировать не имеет ничего общего с браузерами или DOM.

Чтобы сделать это более понятным и упростить создание большего количества сред, в которых может отображаться React, мы разделяем основной пакет реагирования на два: реагировать и реагировать.

По сути, идея React не имеет ничего общего с браузерами, они просто являются одной из многих целей для рендеринга деревьев компонентов. Пакет ReactDOM позволил разработчикам удалить любой ненужный код из пакета React и переместить его в более подходящий репозиторий.

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.

До версии 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 содержит: React.createElement, React.createClass, React.Component, React.PropTypes, React.Children.

Пакет React-dom содержит: ReactDOM.render, ReactDOM.unmountComponentAtNode, ReactDOM.findDOMNode и response-dom / server, который включает в себя: ReactDOMServer.renderToString и ReactDOMServer.renderToStaticMarkup.

Модуль ReactDOM предоставляет специфичные для DOM методы, в то время как React имеет основные инструменты, предназначенные для совместного использования React на разных платформах (например, React Native).

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

Похоже, что они разделили React на reactи react-domпакеты, так что вам не нужно использовать часть, связанную с DOM, для проектов, где вы хотите использовать ее в случаях, не связанных с DOM, как здесь https: // github.com/Flipboard/react-canvas, куда они импортируют

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

как вы видете. Без react-dom.

Чтобы быть более кратким, response предназначен для компонентов, а response-dom предназначен для визуализации компонентов в DOM. «Реакция-Дом» действует как клей между компонентами и DOM. Вы будете использовать метод render () объекта response-dom для визуализации компонентов в DOM, и это все, что вам нужно знать, когда вы начинаете с ним.

react packageДержитreact source для компонентов, состояния, реквизит и весь код , то есть реагировать.

react-domПакет , как следует из названия является glue between React and the DOM. Часто, вы будете использовать только для одной вещи: mounting your application to the index.html file with ReactDOM.render().

Зачем их отделять?

reasonReact и ReactDOM были разделены на две библиотеки было связано с приходом React Native (A react platform for mobile development).