React Native是基于React的，在开发React Native过程中少不了的需要用到React方面的知识。虽然官方也有相应的Document，但篇幅比较多，学起来比较枯燥。
我可以说是从0开始学习React Native，之前学习的人少，自己也走了不少弯路，以后能把自己的一些想法或者是学习方法写出来分享一下，让后来学习的同行们少走一些弯路。（最好先学习一下reactjs）
自己理解的React（我们需要了解的东西）
1.React？
2.React的特点
3.JSX语法
4.组件(Component)
5.组件的属性、状态
一、什么是React？
React是一个用于组建用户界面的JavaScript库，让你更加简单的方式来创建交互式用户界面。
个人认为的优点吧：
1.React就是由许多个组件来组合而成的。
2.数据改变的时候，React能高效的更新和渲染更新的组件。
3.声明性视图让你的代码容易调试，自己能预测出效果
4.封装管理自己的状态组件，将他们组成复杂的界面。
5.由于组件逻辑是用JavaScript编写的，可以轻松地通过程序传递大量数据，并保持DOM状态。
6.一次学习随时随地可以编写，学会了React，不仅可以轻松的开发web，也可以用于React Native来开发Android+ios应用。
二、开始学习React
使用React之前需要在[React官网](https://facebook.github.io/react/downloads.html)下载这些库，也可以将其下载到本地去使用。
-react.js
-react-dom.js
-browser.min.js
上面一共列举了三个库： react.js 、react-dom.js 和 browser.min.js ，它们必须首先加载。
react.js是React的核心库
react-dom.js是提供与DOM相关的功能
browser.min.js的作用是将JSX语法转为JavaScript语法
这一步很消耗时间，实际上线的时候，应该将它放到服务器完成。
注意:我们实际在做React Native开发时，这些库作为React Native核心库已经被初始化在node_modules目录下，所以不需要单独下载。
使用React写出我们非常熟悉的Hello World
JavaScript代码里写着 XML 格式的代码称为 JSX，下文会介绍。为了把 JSX 转成标准的 JavaScript，我们用<script type="text/babel">标签，然后通过Babel转换成在浏览器中真正执行的内容
注意：ReactDOM.render 是 React 的最基本方法，用于将模板转为 HTML 语言，并插入指定的 DOM 节点。
SX 和 HTMLJSX 是一个看起来很像 XML 的 JavaScript 语法扩展。
每一个XML标签都会被JSX转换工具转换成纯JavaScript代码，使用JSX，组件的结构和组件之间的关系看上去更加清晰。
JSX并不是React必须使用的，但React官方建议我们使用 JSX , 因为它能定义简洁且我们熟知的包含属性的树状结构语法。
HTML标签 与 React组件 对比
React 可以渲染 HTML 标签 (strings) 或 React 组件 (classes)。
要渲染 HTML 标签，只需在 JSX 里使用小写字母开头的标签名。
//var myDivElement = <div className="foo">;
React.render(myDivElement, document.body);
要渲染 React 组件，只需创建一个大写字母开头的本地变量。
var MyComponent = React.createClass({/*...*/});
var myElement =<MyComponent someProperty={true} />;
React.render(myElement, document.body);
注意：
- React 的 JSX 里约定分别使用首字母大、小写来区分本地组件的类和 HTML 标签。
- 由于 JSX 就是 JavaScript，一些标识符像 class 和 for 不建议作为 XML 属性名。作为替代， React DOM 使用 className 和 htmlFor 来做对应的属性。
JavaScript 表达式
要使用 JavaScript 表达式作为属性值，只需把这个表达式用一对大括号 ({}) 包起来，不要用引号 (“”)。
// 输入 (JSX):
var person =<Person name={window.isLoggedIn?window.name:''} />;
// 输出 (JS):
var person = React.createElement(
Person,
{name: window.isLoggedIn ? window.name : ''}
);
React中注释
JSX 里添加注释很容易；它们是 JS 表达式。需要在一个标签的子节点内(非最外层)用 {} 包围要注释的部分。
{/*标签子节点的注释*/}
注意：
在标签内要使用{/*注释的内容*/}
在标签节点以外注释，和通常的注释是一样的，多行用/*多行注释的内容*/单行用//单行注释的内容；
修改组件的属性，会导致React不会对组件的属性类型（propTypes）进行的检查。从而引发一些预料之外的问题。
两种写法都能实现
不推荐的：
var component = <Component />;
component.props.foo = x;
component.props.bar = y;
网友评论