Реагируют Собственный компонент

• , Это - платформа для создания исходных приложений с помощью JavaScript.

• Это компилирует в компоненты исходного приложения, который позволяет Вам создать собственные мобильные приложения.

• Никакая потребность перестроить Ваше старое приложение. Все, что необходимо сделать, добавляют, Реагируют Собственный компонент компоненты UI в существующий код app’s, не имея необходимость переписывать.

Реагируют js

• Это поддерживающий и сеть фронтенда и выполняемый на сервере, для создания пользовательских интерфейсов и веб-приложений.

• Это также позволяет нам создавать допускающие повторное использование компоненты UI.

• можно снова использовать компоненты кода в, Реагируют JS, сохраняя Вас много времени.

В ответ на комментарий от @poshest выше, вот Реагировать Собственная версия кода Часов, ранее отправленного в, Реагируют (извините, я не мог прокомментировать раздел непосредственно, иначе я добавлю код там):

Реагируют Собственный компонент пример кода

import { AppRegistry } from 'react-native';
import React, { Component } from 'react';
import { View, Text, StyleSheet } from 'react-native';

class Clock extends Component {
  constructor(props) {
    super(props);
    this.state = { date: new Date() };
  }

  componentDidMount() {
    this.timerID = setInterval(
      () => this.tick(),
      1000
    );
  }

  componentWillUnmount() {
    clearInterval(this.timerID);
  }

  tick() {
    this.setState({
      date: new Date()
    });
  }

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.sectionTitle}>Hello, world!</Text>
        <Text style={styles.sectionDescription}>It is {this.state.date.toLocaleTimeString()}.</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    backgroundColor: 'white',
    flex: 1,
    justifyContent: 'center',
  },
  sectionTitle: {
    fontSize: 24,
    fontWeight: '600',
    color: 'black',
    alignSelf: 'center',
  },
  sectionDescription: {
    marginTop: 8,
    fontSize: 18,
    fontWeight: '400',
    color: 'darkgrey',
    alignSelf: 'center',
  },
});

AppRegistry.registerComponent("clock", () => Clock);

Примечание, что моделирование является полностью моим выбором и не стремится копировать непосредственно <h1> и <h2> теги, используемые в Реагировать коде.

Некоторые различия следующие:
1- Реагировать-собственный-компонент является платформой, которая раньше создавала Мобильные приложения, где ReactJS является библиотекой JavaScript, можно использовать для веб-сайта.
2- Реагировать-собственный-компонент doesn’t использует HTML для рендеринга приложения, в то время как Реагируют использование.
3- Реагировать-собственный-компонент использовал для разработки только Мобильного приложения, в то время как Реагируют использование для веб-сайта и Мобильный.

Немного поздно стороне, но вот более всесторонний ответ с примерами:

Реагируют

, Реагируют, компонентно-ориентированная библиотека UI, которая использует "теневой DOM" для эффективного обновления DOM с тем, что изменилось вместо того, чтобы восстановить все дерево DOM для каждого изменения. Это было первоначально создано для веб-приложений, но теперь может использоваться для мобильного & 3D / стабиловольт также.

Компоненты между Реагируют и Реагируют, Собственным компонентом нельзя обменяться, потому что Реагируют, Собственный компонент отображается на собственные мобильные элементы UI, но бизнес-логику, и связанный с нерендерингом код может быть снова использован.

ReactDOM

был первоначально включен с библиотекой React, но был разделен, однажды Реагируют, использовался для других платформ, чем просто сеть. Это служит точкой входа к DOM и используется в объединении с, Реагируют.

Пример:

import React from 'react';
import ReactDOM from 'react-dom';

class App extends Component {
    state = {
        data: [],
    }

    componentDidMount() {
        const data = API.getData(); // fetch some data
        this.setState({ data })
    }

    clearData = () => {
        this.setState({
            data: [],
        });
    }

    render() {
        return (
            <div>
                {this.state.data.map((data) => (
                    <p key={data.id}>{data.label}</p>
                ))}
                <button onClick={this.clearData}>
                    Clear list
                </button>
            </div>
        );
    }

}

ReactDOM.render(App, document.getElementById('app'));

Реагируют, Собственный компонент

Реагирует, Собственный компонент является межплатформенной платформой для мобильных устройств, которая Реагирует использование, и связывается между JavaScript, и это - собственный дубликат через "мост". Из-за этого, большое структурирование UI должно отличаться, когда использование Реагирует Собственный компонент. Например: при создании списка Вы столкнетесь с главными проблемами производительности, при попытке использовать map для пристраивания списка вместо, Реагируют Собственный компонент FlatList. Реагируйте Собственный компонент может использоваться для пристраивания мобильных приложений IOS/Android, а также для умных часов и ТВ.

Экспо

Экспо является дежурным, когда запуск нового Реагирует Исходное приложение.

Экспо является платформой, и платформа для универсального Реагируют приложения. Это - ряд инструментов, и сервисы, созданные вокруг, Реагируют Собственные и собственные платформы, которые помогают Вам разработать, создать, развернуться и быстро выполнить итерации на iOS, Android и веб-приложениях

Примечание: При использовании Экспо, можно только использовать Собственный API, который они предоставляют. Всеми дополнительными библиотеками, которые Вы включаете, должен будет быть чистый JavaScript, или необходимо будет извлечь экспо.

То же использование в качестве примера Реагируют Собственный компонент:

import React, { Component } from 'react';
import { Flatlist, View, Text, StyleSheet } from 'react-native';

export default class App extends Component {
    state = {
        data: [],
    }

    componentDidMount() {
        const data = API.getData(); // fetch some data
        this.setState({ data })
    }

    clearData = () => {
        this.setState({
            data: [],
        });
    }

    render() {
        return (
            <View style={styles.container}>
                <FlatList
                    data={this.state.data}
                    renderItem={({ item }) => <Text key={item.id}>{item.label}</Text>}
                />
                <Button title="Clear list" onPress={this.clearData}></Button>
            </View>
        );
    }

}

const styles = StyleSheet.create({
    container: {
        flex: 1,
    },
});

Различия:

• Уведомление, что все за пределами рендеринга может остаться тем же, это - то, почему бизнес-логика / код логики жизненного цикла может быть снова использована через, Реагируют и Реагируют, Собственный компонент
• В Реагирует Собственный компонент, все компоненты должны быть импортированы от реагировать-собственного-компонента или другой библиотеки UI
• Используя определенный API, которые отображаются на собственные компоненты, обычно будут более производительными, чем попытка обработать все на стороне JavaScript.напр. отображение компонентов для создания списка по сравнению с использованием тонких различий flatlist
• : вещи как onClick превращаются onPress, Реагируют, Собственный компонент использует таблицы стилей, чтобы определить стили более производительным способом и Реагировать, Собственный компонент использует flexbox в качестве структуры раскладки по умолчанию для хранения вещей быстро реагирующими.
• С тех пор нет никакого традиционного "DOM" в, Реагируют Собственный компонент, только чистыми библиотеками JavaScript можно пользоваться и через Реагировать и Реагировать Собственный компонент

React360

, также стоит упомянуть, что Реагируют, может также использоваться для разработки 3D приложений / приложений VR. Структура компонента очень похожа для Реакции Собственного компонента. https://facebook.github.io/react-360 /

React Native is an entire platform allowing you to build native, cross-platform mobile apps, and React.js is a JavaScript library you use for constructing a high performing UI layer. ... Like the browser code in React is rendered through Virtual DOM while React Native uses Native API's to render components on mobile.

React.js, часто называемый, как Реагируют или ReactJS, является библиотекой JavaScript, ответственной за создание иерархии компонентов UI или другими словами, ответственный за рендеринг компонентов UI. Это оказывает поддержку и для frontend и для серверной стороны.

Реагируют, Собственный компонент является платформой для создания исходных приложений с помощью JavaScript. Реагируйте Собственный компонент компилирует в компоненты исходного приложения, который позволяет Вам создать собственные мобильные приложения. В Реагируют JS, Реагируют, основная абстракция, Реагируют DOM для веб-платформы, в то время как с Реагируют Собственный компонент, Реагируют, все еще основная абстракция, но Реагируют Собственный компонент. Таким образом, синтаксис и рабочий процесс остаются подобными, но компоненты отличаются.