我已经开始学习React出于好奇,想知道React和React Native之间的区别-虽然不能找到一个满意的答案使用谷歌。React和React Native似乎有相同的格式。它们的语法完全不同吗?


当前回答

React-Native是一个框架,其中ReactJS是一个javascript库,可以用于您的网站。

React-native提供了默认的核心组件(图像,文本),其中React提供了一堆组件并使它们协同工作。

其他回答

为了回应上面@poshest的评论,这里有一个React Native版本的时钟代码,之前在React中发布(抱歉,我无法直接评论这部分,否则我会在那里添加代码):

React Native代码示例

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

注意,样式完全是我的选择,并不寻求直接复制在React代码中使用的<h1>和<h2>标记。

在Reactjs中,虚拟DOM用于在Reactjs中渲染浏览器代码,而在React Native中,本地api用于渲染移动设备中的组件。

用Reactjs开发的应用程序在UI中渲染HTML,而React Native使用JSX来渲染UI,这只是javascript。

React是一个用于构建用户界面的JavaScript库。它用于重用UI组件。 React Native是一个JavaScript框架,用于为iOS和Android编写真实的原生渲染移动应用程序。 两者都是由facebook开发的,它们共享相同的生命周期方法。

React是React Native和React DOM的基本抽象,所以如果你要使用React Native,你还需要React…与web相同,但不是React Native,你将需要React DOM。

由于React是基本抽象,一般语法和工作流是相同的,但你将使用的组件是非常不同的,因此你需要学习这些差异,这是内联React,所谓的moto,即“一次学习,随处编写”,因为如果你知道React(基本抽象),你可以简单地学习平台之间的差异,而不学习另一种编程语言,语法和工作流。

React是一个声明性的、高效的、灵活的JavaScript库,用于构建用户界面。你的组件告诉React你想要呈现什么——然后当你的数据发生变化时,React会有效地更新并呈现正确的组件。这里,ShoppingList是一个React组件类,或者React组件类型。

React Native应用程序是真正的移动应用程序。使用React Native,你不需要构建“移动web应用程序”、“HTML5应用程序”或“混合应用程序”。你构建了一个真正的移动应用,它与使用Objective-C或Java构建的应用没有什么区别。React Native使用与常规iOS和Android应用相同的基本UI构建块。

更多信息