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


当前回答

为了回应上面@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>标记。

其他回答

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

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

更多信息

我们无法准确地比较它们。用例中存在差异。

(2018更新)


反应

React的主要关注点是Web开发。

React’s virtual DOM is faster than the conventional full refresh model, since the virtual DOM refreshes only parts of the page. You can reuse code components in React, saving you a lot of time. (You can in React Native too.) As a business: The rendering of your pages completely, from the server to the browser will improve the SEO of your web app. It improves the debugging speed making your developer’s life easier. You can use hybrid mobile app development, like Cordova or Ionic, to build mobile apps with React, but is more efficiently building mobile apps with React Native from many points.


反应本地

React的扩展,针对移动开发。

Its main focus is all about Mobile User Interfaces. iOS & Android are covered. Reusable React Native UI components & modules allow hybrid apps to render natively. No need to overhaul your old app. All you have to do is add React Native UI components into your existing app’s code, without having to rewrite. Doesn't use HTML to render the app. Provides alternative components that work in a similar way, so it wouldn't be hard to understand them. Because your code doesn’t get rendered in an HTML page, this also means you won’t be able to reuse any libraries you previously used with React that renders any kind of HTML, SVG or Canvas. React Native is not made from web elements and can’t be styled in the same way. Goodbye CSS Animations!


希望我帮到你了:)

下面是React项目。

在Facebook,他们发明了React,这样JavaScript就可以使用虚拟DOM模型更快地操作网站DOM。

DOM完全刷新比React虚拟DOM模型慢,后者只刷新页面的一部分(即部分刷新)。

正如你从这个视频中了解到的,Facebook并没有发明React,因为他们立即意识到部分刷新会比传统的更快。最初,他们需要一种方法来减少Facebook应用程序的重建时间,幸运的是,这带来了部分DOM刷新。

React native只是React的结果。它是一个使用JavaScript构建原生应用程序的平台。

在使用React native之前,你需要掌握Java或Kotlin(适用于Android), Swift或Objective-C(适用于iPhone和iPad)来创建原生应用。

使用React Native,可以在JavaScript中模仿原生应用程序的行为,最终,你将得到特定于平台的代码作为输出。如果需要进一步优化应用程序,甚至可以混合使用本机代码和JavaScript。

正如Olivia Bishop在视频中所说,85%的React原生代码库可以在平台之间共享。这些将是应用程序通常使用的组件和公共逻辑。

15%的代码是平台特定的。特定于平台的JavaScript赋予了平台特色(并使体验有所不同)。

最酷的事情是这个特定于平台的代码已经编写好了,所以您只需要使用它。

React用于在浏览器中工作的web应用程序。 React Native用于android和IOS应用程序,这些应用程序在移动应用程序中工作。

ReactJS是一个javascript库,用于构建web界面。你需要一个像webpack这样的捆绑器,并尝试安装你建立网站所需的模块。

React Native是一个javascript框架,它包含了编写多平台应用程序(如iOS或Android)所需的一切。你需要安装xcode和android studio来构建和部署你的应用。

与ReactJS不同,React-Native不使用HTML,而是使用类似的组件,你可以跨ios和android来构建你的应用程序。这些组件使用真正的本地组件来构建ios和android应用程序。因此,React-Native应用程序感觉真实,不像其他混合开发平台。组件还增加了代码的可重用性,因为你不需要在ios和android上再次创建相同的用户界面。