ReactNative入门.md

ReactNative入门

简介

ReactNative旨在开发过程的高效，它具有一些原生App所不具备的优势，它的跨平台性非常强，代码的复用程度非常的高，并且可以具有热更新的能力，其次就是它的社区也在日趋的强大起来。

为什么选择ReactNative

纵观国内的比较大的厂商并没有完全的转移到React Native，但也没有完全的排斥说不搞React Native，所以学习这样一个新的技能对我们有百利而无一害，在学习React Native的过程中，我们也会接触到React这样一个新的UI方案，同时对一些ES6，ES7新的特性也都会有接触，总体感觉还不错～

入门

学习React Native最好还是要有一些React JavaScript 以及原生应用的开发经验，当然没有也无妨，慢慢一步一步的来嘛。

目前我介绍的是针对Android端介绍的，后续也会把Ios相关的内容补上。

需要有的软件:

• Node.js
• Android studio
• Watchman

运行：

react-native init AwesomeProject
cd AwesomeProject
react-native run-android

知识点

项目的入口: index.android.js / index.ios.js

视图呈现:

render() {
    return (
      <View style={cStyles.container}>
        <View style={styles.row}>
          <Text style={styles.label}>AAA</Text>
          <View style={styles.rowCount}>
            <Text style={styles.countUnit}>BBB/Text>
            <Text style={styles.price}>CCC</Text>
          </View>
        </View>
        <LinkRow label="DDD" onPress={() => {
        }}/>
        <LinkRow label="EEE" onPress={this.logout}/>
      </View>
    );
  }

我们的视图需要写在return()下面，并且这个下面只能有一个根View

抽出公共控件:

在界面中，可能我们有很多控件是可以复用的，如果我们不把它们抽出来的话，可能就会导致代码的臃肿，并且不是很利于维护，所以我们应该将公共部分抽出来。

将公用的style抽象出来

同上

推荐编译器

• 需要测试性能的时候需要使用Android studio
• 与性能无关时，编写代码时还是推荐使用WebStorm编写代码

好了，就先介绍到这里吧，在等到我有时间的时候，可以介绍一下，手写一个tab，或者实现登录注册的全部逻辑(包含网络框架)。