update example in readme

httnn · Mar 14, 2017 · 3687504 · 3687504
1 parent 750f534
commit 3687504
Showing 1 changed file with 39 additions and 50 deletions.
diff --git a/README.md b/README.md
@@ -52,59 +52,48 @@ modalRef.animateOffset(number);
 
 ## Example
 ```javascript
-import React, { Component } from 'react';
+import React from 'react';
 import Modal from 'react-native-simple-modal';
+import {AppRegistry, Text, TouchableOpacity, View} from 'react-native';
 
-import {
-   AppRegistry,
-   Text,
-   TouchableOpacity,
-   View
-} from 'react-native';
-
-class Example extends Component {
-   constructor() {
-      super();
-      this.state = {
-         open: false
-      };
-   }
-   render() {
-      return (
-         <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
-            <TouchableOpacity onPress={() => this.setState({open: true})}>
-               <Text>Open modal</Text>
-            </TouchableOpacity>
-            <Modal
-               offset={this.state.offset}
-               open={this.state.open}
-               modalDidOpen={() => console.log('modal did open')}
-               modalDidClose={() => this.setState({open: false})}
-               style={{alignItems: 'center'}}>
-               <View>
-                  <Text style={{fontSize: 20, marginBottom: 10}}>Hello world!</Text>
-                  <TouchableOpacity
-                     style={{margin: 5}}
-                     onPress={() => this.setState({offset: -100})}>
-                     <Text>Move modal up</Text>
-                  </TouchableOpacity>
-                  <TouchableOpacity
-                     style={{margin: 5}}
-                     onPress={() => this.setState({offset: 0})}>
-                     <Text>Reset modal position</Text>
-                  </TouchableOpacity>
-                  <TouchableOpacity
-                     style={{margin: 5}}
-                     onPress={() => this.setState({open: false})}>
-                     <Text>Close modal</Text>
-                  </TouchableOpacity>
-               </View>
-            </Modal>
-         </View>
-      );
-   }
+export default class Example extends React.Component {
+  state = {open: false};
+  render() {
+    return (
+    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
+      <TouchableOpacity onPress={() => this.setState({open: true})}>
+        <Text>Open modal</Text>
+      </TouchableOpacity>
+      <Modal
+        offset={this.state.offset}
+        open={this.state.open}
+        modalDidOpen={() => console.log('modal did open')}
+        modalDidClose={() => this.setState({open: false})}
+        style={{alignItems: 'center'}}>
+        <View>
+          <Text style={{fontSize: 20, marginBottom: 10}}>Hello world!</Text>
+          <TouchableOpacity
+          style={{margin: 5}}
+          onPress={() => this.setState({offset: -100})}>
+            <Text>Move modal up</Text>
+          </TouchableOpacity>
+          <TouchableOpacity
+            style={{margin: 5}}
+            onPress={() => this.setState({offset: 0})}>
+            <Text>Reset modal position</Text>
+          </TouchableOpacity>
+          <TouchableOpacity
+            style={{margin: 5}}
+            onPress={() => this.setState({open: false})}>
+            <Text>Close modal</Text>
+          </TouchableOpacity>
+        </View>
+      </Modal>
+    </View>
+    );
+  }
 }
 
-AppRegistry.registerComponent('myapp', () => Example);
+AppRegistry.registerComponent('ExampleModal', () => Example);
 
 ```