mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-02-11 09:11:14 +08:00
Clean up UIExplorer and seperate RCTRootView examples
Reviewed By: nicklockwood Differential Revision: D2951030 fb-gh-sync-id: e7cf64035d8e9e30aafe8b4944b6a20e4bc55078 shipit-source-id: e7cf64035d8e9e30aafe8b4944b6a20e4bc55078
This commit is contained in:
committed by
facebook-github-bot-5
parent
9294c6f5d4
commit
2b46fd424d
@@ -16,8 +16,8 @@
|
||||
*/
|
||||
'use strict';
|
||||
|
||||
var React = require('react-native');
|
||||
var {
|
||||
const React = require('react-native');
|
||||
const {
|
||||
AppRegistry,
|
||||
BackAndroid,
|
||||
Dimensions,
|
||||
@@ -27,29 +27,32 @@ var {
|
||||
View,
|
||||
StatusBar,
|
||||
} = React;
|
||||
var UIExplorerList = require('./UIExplorerList.android');
|
||||
const UIExplorerList = require('./UIExplorerList.android');
|
||||
|
||||
var DRAWER_WIDTH_LEFT = 56;
|
||||
const DRAWER_WIDTH_LEFT = 56;
|
||||
|
||||
var UIExplorerApp = React.createClass({
|
||||
getInitialState: function() {
|
||||
return {
|
||||
class UIExplorerApp extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.onSelectExample = this.onSelectExample.bind(this);
|
||||
this._handleBackButtonPress = this._handleBackButtonPress.bind(this);
|
||||
this.state = {
|
||||
example: this._getUIExplorerHome(),
|
||||
};
|
||||
},
|
||||
}
|
||||
|
||||
_getUIExplorerHome: function() {
|
||||
_getUIExplorerHome() {
|
||||
return {
|
||||
title: 'UIExplorer',
|
||||
component: this._renderHome(),
|
||||
};
|
||||
},
|
||||
}
|
||||
|
||||
componentWillMount: function() {
|
||||
componentWillMount() {
|
||||
BackAndroid.addEventListener('hardwareBackPress', this._handleBackButtonPress);
|
||||
},
|
||||
}
|
||||
|
||||
render: function() {
|
||||
render() {
|
||||
return (
|
||||
<DrawerLayoutAndroid
|
||||
drawerPosition={DrawerLayoutAndroid.positions.Left}
|
||||
@@ -59,19 +62,19 @@ var UIExplorerApp = React.createClass({
|
||||
renderNavigationView={this._renderNavigationView}>
|
||||
{this._renderNavigation()}
|
||||
</DrawerLayoutAndroid>
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
_renderNavigationView: function() {
|
||||
_renderNavigationView() {
|
||||
return (
|
||||
<UIExplorerList
|
||||
onSelectExample={this.onSelectExample}
|
||||
isInDrawer={true}
|
||||
/>
|
||||
);
|
||||
},
|
||||
}
|
||||
|
||||
onSelectExample: function(example) {
|
||||
onSelectExample(example) {
|
||||
this.drawer.closeDrawer();
|
||||
if (example.title === this._getUIExplorerHome().title) {
|
||||
example = this._getUIExplorerHome();
|
||||
@@ -79,10 +82,10 @@ var UIExplorerApp = React.createClass({
|
||||
this.setState({
|
||||
example: example,
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
_renderHome: function() {
|
||||
var onSelectExample = this.onSelectExample;
|
||||
_renderHome() {
|
||||
const onSelectExample = this.onSelectExample;
|
||||
return React.createClass({
|
||||
render: function() {
|
||||
return (
|
||||
@@ -93,10 +96,10 @@ var UIExplorerApp = React.createClass({
|
||||
);
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
_renderNavigation: function() {
|
||||
var Component = this.state.example.component;
|
||||
_renderNavigation() {
|
||||
const Component = this.state.example.component;
|
||||
return (
|
||||
<View style={styles.container}>
|
||||
<StatusBar
|
||||
@@ -114,9 +117,9 @@ var UIExplorerApp = React.createClass({
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
},
|
||||
}
|
||||
|
||||
_handleBackButtonPress: function() {
|
||||
_handleBackButtonPress() {
|
||||
if (
|
||||
this._exampleRef &&
|
||||
this._exampleRef.handleBackAction &&
|
||||
@@ -129,10 +132,11 @@ var UIExplorerApp = React.createClass({
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
var styles = StyleSheet.create({
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
flex: 1,
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user