React Native开发入门

1、brew intsall node
2、brew install watchman
3、brew install flow （安装的类型检查库）

1、brew update
2、brew upgrade

npm install -g react-native-cli

export default class Helloworld extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Hello World!
        </Text>
      </View>
    );
  }
}
 

#import "AppDelegate.h"

#import "RCTBundleURLProvider.h"
#import "RCTRootView.h"

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  NSURL *jsCodeLocation;

  jsCodeLocation = [[RCTBundleURLProvidersharedSettings] jsBundleURLForBundleRoot:@"index.ios"fallbackResource:nil];

  RCTRootView *rootView = [[RCTRootViewalloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"Helloworld"
                                               initialProperties:nil
                                                   launchOptions:launchOptions];
  rootView.backgroundColor = [[UIColoralloc] initWithRed:1.0fgreen:1.0fblue:1.0falpha:1];

  self.window = [[UIWindowalloc] initWithFrame:[UIScreenmainScreen].bounds];
  UIViewController *rootViewController = [UIViewControllernew];
  rootViewController.view = rootView;
  self.window.rootViewController = rootViewController;
  [self.windowmakeKeyAndVisible];
  returnYES;
}

@end

import React, { Component } from ‘react‘;
import {
  AppRegistry,
  StyleSheet,
  Text,
  View
} from ‘react-native‘;

export default class Helloworld extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Hello World!
        </Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: ‘center‘,
    alignItems: ‘center‘,
    backgroundColor: ‘#F5FCFF‘,
  },
  welcome: {
    fontSize: 20,
    textAlign: ‘center‘,
    margin: 10,
  },
  instructions: {
    textAlign: ‘center‘,
    color: ‘#333333‘,
    marginBottom: 5,
  },
});

AppRegistry.registerComponent(‘Helloworld‘, () => Helloworld);

 

import React, { Component } from ‘react‘;
import {
  AppRegistry,
  StyleSheet,
  Text,
  View
} from ‘react-native‘;