源码
/** * Sample React Native App * https://github.com/facebook/react-native */
@H_301_5@'use strict';
var React = require(@H_301_5@'react-native');
var {
AppRegistry,StyleSheet,Text,View,} = React;
var helloworld = React.createClass({
render: function() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React Native!
</Text>
<Text style={styles.instructions}>
To get started,edit index.ios.js
</Text>
<Text style={styles.instructions}>
Press Cmd+R to reload,{@H_301_5@'\n'}
Cmd+D or shake for dev menu
</Text>
</View>
);
}
});
var styles = StyleSheet.create({
container: {
flex: 1,justifyContent: @H_301_5@'center',alignItems: @H_301_5@'center',backgroundColor: @H_301_5@'#F5FCFF',},welcome: {
fontSize: 20,textAlign: @H_301_5@'center',margin: 10,instructions: {
textAlign: @H_301_5@'center',color: @H_301_5@'#333333',marginBottom: 5,});
AppRegistry.registerComponent(@H_301_5@'hellowrold',() => helloworld);
问题
AppRegistry.registerComponent('hellowrold',() => helloworld);
中registerComponent
方法的第一个参数hellowrold
参数一定要跟项目名一样,否则就会报错。
总结
新建项目分5步:
引入react-native
var React = require(@H_301_5@'react-native');
定义组件
var { AppRegistry,} =@H_301_5@ React;
定义界面控件
var helloworld =@H_301_5@ React.createClass({});
定义控件样式
var styles = StyleSheet.create({});
为项目注册界面
AppRegistry.registerComponent(@H_301_5@'项目名',() =>界面);