我已经开始学习React出于好奇,想知道React和React Native之间的区别-虽然不能找到一个满意的答案使用谷歌。React和React Native似乎有相同的格式。它们的语法完全不同吗?
当前回答
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构建块。
更多信息
反应:
React是一个声明性的、高效的、灵活的JavaScript库 构建用户界面。
本机反应:
React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components. With React Native, you don't build a “mobile web app”, an “HTML5 app”, or a “hybrid app”. You build a real mobile app that's indistinguishable from an app built using Objective-C or Java. React Native uses the same fundamental UI building blocks as regular iOS and Android apps. You just put those building blocks together using JavaScript and React. React Native lets you build your app faster. Instead of recompiling, you can reload your app instantly. With hot reloading, you can even run new code while retaining your application state. Give it a try - it's a magical experience. React Native combines smoothly with components written in Objective-C, Java, or Swift. It's simple to drop down to native code if you need to optimize a few aspects of your application. It's also easy to build part of your app in React Native, and part of your app using native code directly - that's how the Facebook app works.
基本上React是web应用视图的UI库,使用javascript和JSX, React native是React之上的一个额外库,用于iOS和Android设备的原生应用。
React代码示例:
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
class Clock extends React.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 (
<div>
<h1>Hello, world!</h1>
<h2>It is {this.state.date.toLocaleTimeString()}.</h2>
</div>
);
}
}
ReactDOM.render(
<Clock />,
document.getElementById('root')
);
React Native代码示例:
import React, { Component } from 'react';
import { Text, View } from 'react-native';
class WhyReactNativeIsSoGreat extends Component {
render() {
return (
<View>
<Text>
If you like React on the web, you'll like React Native.
</Text>
<Text>
You just use native components like 'View' and 'Text',
instead of web components like 'div' and 'span'.
</Text>
</View>
);
}
}
有关React的更多信息,请访问facebook团队创建的官方网站:
https://reactjs.org/
有关React Native的更多信息,请访问下面的React Native网站:
https://reactnative.dev/
下面是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赋予了平台特色(并使体验有所不同)。
最酷的事情是这个特定于平台的代码已经编写好了,所以您只需要使用它。
我们无法准确地比较它们。用例中存在差异。
(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!
希望我帮到你了:)
至于组件的生命周期和所有其他功能,基本上都是一样的。
区别主要在于使用的JSX标记。React使用了一个类似html的格式。另一个是react-native用来显示视图的标记。
推荐文章
- 如何获得十六进制颜色值而不是RGB值?
- 字符串strip() JavaScript?
- 如何将一个标题转换为jQuery的URL段塞?
- 获取对象的第一个索引
- 我如何用javascript编程点击链接?
- JavaScript:客户端验证与服务器端验证
- React钩子:从回调中访问最新状态
- 使用lodash将对象转换为数组
- 打印在 JsFiddle 中
- AngularJS只适用于单页应用程序吗?
- Javascript和regex:分割字符串并保留分隔符
- 如何检查DST(日光节约时间)是否有效,如果是,偏移量?
- 如何打破_。在underscore.js中的每个函数
- 如何在jQuery中获得当前日期?
- 如何创建一个日期对象从字符串在javascript