Skip to content
This repository was archived by the owner on Sep 13, 2020. It is now read-only.

Commit e636cfc

Browse files
KureevKureev
committed
Update example
1 parent c4af819 commit e636cfc

File tree

28 files changed

+4297
-202
lines changed

28 files changed

+4297
-202
lines changed

‎.eslintrc‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,13 @@
99

1010
"react/jsx-filename-extension": [1, { "extensions": [".js"] }],
1111
"react/sort-comp": [1, {
12-
order: [
13-
'type-annotations',
14-
'static-methods',
15-
'lifecycle',
16-
'everything-else',
17-
'render',
18-
],
12+
"order": [
13+
"type-annotations",
14+
"static-methods",
15+
"lifecycle",
16+
"everything-else",
17+
"render"
18+
]
1919
}]
2020
}
2121
}

‎examples/Basic/.babelrc‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"presets": ["react-native"]
3+
}

‎examples/Basic/.flowconfig‎

Lines changed: 19 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,18 @@
11
[ignore]
2+
; We fork some components by platform
3+
.*/*[.]android.js
24

3-
# We fork some components by platform.
4-
.*/*.android.js
5+
; Ignore "BUCK" generated dirs
6+
<PROJECT_ROOT>/\.buckd/
57

6-
# Ignore templates with `@flow` in header
7-
.*/local-cli/generator.*
8+
; Ignore unexpected extra "@providesModule"
9+
.*/node_modules/.*/node_modules/fbjs/.*
810

9-
# Ignore malformed json
10-
.*/node_modules/y18n/test/.*\.json
11+
; Ignore duplicate module providers
12+
; For RN Apps installed via npm, "Libraries" folder is inside
13+
; "node_modules/react-native" but in the source repo it is in the root
14+
.*/Libraries/react-native/React.js
15+
.*/Libraries/react-native/ReactNative.js
1116

1217
[include]
1318

@@ -17,25 +22,24 @@ node_modules/react-native/flow
1722
flow/
1823

1924
[options]
20-
module.system=haste
21-
22-
esproposal.class_static_fields=enable
23-
esproposal.class_instance_fields=enable
25+
emoji=true
2426

25-
experimental.strict_type_args=true
27+
module.system=haste
2628

2729
munge_underscores=true
2830

29-
module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub'
3031
module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
3132

3233
suppress_type=$FlowIssue
3334
suppress_type=$FlowFixMe
3435
suppress_type=$FixMe
3536

36-
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(2[0-7]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
37-
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(2[0-7]\\|1[0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
37+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(4[0-7]\\|[1-3][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
38+
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(4[0-7]\\|[1-3][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
3839
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
40+
suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError
41+
42+
unsafe.enable_getters_and_setters=true
3943

4044
[version]
41-
^0.27.0
45+
^0.47.0

‎examples/Basic/.gitattributes‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
*.pbxproj -text

‎examples/Basic/.gitignore‎

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -22,20 +22,32 @@ DerivedData
2222
*.xcuserstate
2323
project.xcworkspace
2424

25-
# Android/IJ
25+
# Android/IntelliJ
2626
#
27-
*.iml
27+
build/
2828
.idea
2929
.gradle
3030
local.properties
31+
*.iml
3132

3233
# node.js
3334
#
3435
node_modules/
3536
npm-debug.log
37+
yarn-error.log
3638

3739
# BUCK
3840
buck-out/
3941
\.buckd/
40-
android/app/libs
41-
android/keystores/debug.keystore
42+
*.keystore
43+
44+
# fastlane
45+
#
46+
# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
47+
# screenshots whenever they are needed.
48+
# For more information about the recommended setup visit:
49+
# https://github.com/fastlane/fastlane/blob/master/fastlane/docs/Gitignore.md
50+
51+
fastlane/report.xml
52+
fastlane/Preview.html
53+
fastlane/screenshots

‎examples/Basic/Basic.js‎

Lines changed: 29 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
1-
const React = require('react');
2-
const SideMenu = require('react-native-side-menu');
3-
const Menu = require('./Menu');
4-
5-
const {
1+
import React, { Component } from 'react';
2+
import {
63
StyleSheet,
74
Text,
85
View,
96
Image,
107
TouchableOpacity,
11-
} = require('react-native');
12-
const { Component } = React;
8+
} from 'react-native';
9+
import SideMenu from 'react-native-side-menu';
10+
import Menu from './Menu';
11+
12+
const image = require('./assets/menu.png');
1313

1414
const styles = StyleSheet.create({
1515
button: {
@@ -40,29 +40,17 @@ const styles = StyleSheet.create({
4040
},
4141
});
4242

43-
class Button extends Component {
44-
handlePress(e) {
45-
if (this.props.onPress) {
46-
this.props.onPress(e);
47-
}
48-
}
43+
export default class Basic extends Component {
44+
constructor(props) {
45+
super(props);
4946

50-
render() {
51-
return (
52-
<TouchableOpacity
53-
onPress={this.handlePress.bind(this)}
54-
style={this.props.style}>
55-
<Text>{this.props.children}</Text>
56-
</TouchableOpacity>
57-
);
58-
}
59-
}
47+
this.toggle = this.toggle.bind(this);
6048

61-
module.exports = class Basic extends Component {
62-
state = {
63-
isOpen: false,
64-
selectedItem: 'About',
65-
};
49+
this.state = {
50+
isOpen: false,
51+
selectedItem: 'About',
52+
};
53+
}
6654

6755
toggle() {
6856
this.setState({
@@ -71,15 +59,14 @@ module.exports = class Basic extends Component {
7159
}
7260

7361
updateMenuState(isOpen) {
74-
this.setState({ isOpen, });
62+
this.setState({ isOpen });
7563
}
7664

77-
onMenuItemSelected = (item) => {
65+
onMenuItemSelected = item =>
7866
this.setState({
7967
isOpen: false,
8068
selectedItem: item,
8169
});
82-
}
8370

8471
render() {
8572
const menu = <Menu onItemSelected={this.onMenuItemSelected} />;
@@ -88,7 +75,8 @@ module.exports = class Basic extends Component {
8875
<SideMenu
8976
menu={menu}
9077
isOpen={this.state.isOpen}
91-
onChange={(isOpen) => this.updateMenuState(isOpen)}>
78+
onChange={isOpen => this.updateMenuState(isOpen)}
79+
>
9280
<View style={styles.container}>
9381
<Text style={styles.welcome}>
9482
Welcome to React Native!
@@ -104,11 +92,16 @@ module.exports = class Basic extends Component {
10492
Current selected menu item is: {this.state.selectedItem}
10593
</Text>
10694
</View>
107-
<Button style={styles.button} onPress={() => this.toggle()}>
95+
<TouchableOpacity
96+
onPress={this.toggle}
97+
style={styles.button}
98+
>
10899
<Image
109-
source={require('./assets/menu.png')} style={{width: 32, height: 32}} />
110-
</Button>
100+
source={image}
101+
style={{ width: 32, height: 32 }}
102+
/>
103+
</TouchableOpacity>
111104
</SideMenu>
112105
);
113106
}
114-
};
107+
}

‎examples/Basic/Menu.js‎

Lines changed: 31 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
1-
const React = require('react');
2-
const {
1+
import React from 'react';
2+
import PropTypes from 'prop-types';
3+
import {
34
Dimensions,
45
StyleSheet,
56
ScrollView,
67
View,
78
Image,
89
Text,
9-
} = require('react-native');
10-
const { Component } = React;
10+
} from 'react-native';
1111

1212
const window = Dimensions.get('window');
1313
const uri = 'https://pickaface.net/gallery/avatar/Opi51c74d0125fd4.png';
@@ -42,33 +42,34 @@ const styles = StyleSheet.create({
4242
},
4343
});
4444

45-
module.exports = class Menu extends Component {
46-
static propTypes = {
47-
onItemSelected: React.PropTypes.func.isRequired,
48-
};
45+
export default function Menu({ onItemSelected }) {
46+
return (
47+
<ScrollView scrollsToTop={false} style={styles.menu}>
48+
<View style={styles.avatarContainer}>
49+
<Image
50+
style={styles.avatar}
51+
source={{ uri }}
52+
/>
53+
<Text style={styles.name}>Your name</Text>
54+
</View>
4955

50-
render() {
51-
return (
52-
<ScrollView scrollsToTop={false} style={styles.menu}>
53-
<View style={styles.avatarContainer}>
54-
<Image
55-
style={styles.avatar}
56-
source={{ uri, }}/>
57-
<Text style={styles.name}>Your name</Text>
58-
</View>
56+
<Text
57+
onPress={() => onItemSelected('About')}
58+
style={styles.item}
59+
>
60+
About
61+
</Text>
5962

60-
<Text
61-
onPress={() => this.props.onItemSelected('About')}
62-
style={styles.item}>
63-
About
64-
</Text>
63+
<Text
64+
onPress={() => onItemSelected('Contacts')}
65+
style={styles.item}
66+
>
67+
Contacts
68+
</Text>
69+
</ScrollView>
70+
);
71+
}
6572

66-
<Text
67-
onPress={() => this.props.onItemSelected('Contacts')}
68-
style={styles.item}>
69-
Contacts
70-
</Text>
71-
</ScrollView>
72-
);
73-
}
73+
Menu.propTypes = {
74+
onItemSelected: PropTypes.func.isRequired,
7475
};

0 commit comments

Comments
 (0)