React Native 开发之 (04) 例子讲解

Posted 王信平

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了React Native 开发之 (04) 例子讲解相关的知识,希望对你有一定的参考价值。

 

index.ios.js

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

class Test extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
           Hello React Native123.
        </Text>
        <Text style={styles.instructions}>
          To get started, edit index.ios.js
        </Text>
        <Text style={styles.instructions}>
          Press Cmd+R to reload,{\n}
          Cmd+D or shake for dev menu
        </Text>
      </View>
    );
  }
}

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

AppRegistry.registerComponent(Test, () => Test);

 

以上是关于React Native 开发之 (04) 例子讲解的主要内容,如果未能解决你的问题,请参考以下文章

React Native之底层源码分析篇

React Native之底层源码分析篇

React Native之ViewPagerAndroid仿淘宝首页顶部分类布局效果实现

听晴明老师从头讲React Native

React Native开发React Native控件之Touchable*系列组件详解(18)

React Native开发React Native控件之ProgressBarAndroid进度条讲解(12)