log out

Author: Liqiankun

src/pages/Profile/index.js

@@ -3,14 +3,25 @@ import {
     Text,
     View
 } from 'react-native'
+import { connect } from 'react-redux'
+import DLButton from '../../components/Button'
 import styles from '../../styles'
+import { changeStack } from '../../store/actions/login'
 
-export default class Profile extends Component {
+class Profile extends Component {
     render() {
         return (
             <View style={styles.container}>
-                <Text>Profile Page</Text>
+                <DLButton
+                    buttonStyle={styles.logoutButton}
+                    title='Log out'
+                    onPress={() => this.props.switch()}
+                />
             </View>
         )
     }
 }
+
+export default connect(undefined, {
+    switch: changeStack
+})(Profile)

src/routes/index.js

@@ -106,11 +106,14 @@ AppStack = ({ isLaunching }) => (
   </Stack.Navigator>
 )
 
-const SwitchStack = ({ isLaunching }) => (
-  <NavigationContainer>
-    <AppStack isLaunching={isLaunching} />
-  </NavigationContainer>
-)
+const SwitchStack = ({ isLaunching }) => {
+  console.log('------', isLaunching)
+  return (
+    <NavigationContainer>
+      <AppStack isLaunching={isLaunching} />
+    </NavigationContainer>
+  )
+}
 
 export default connect((state) => ({
   isLaunching: state.Login.isLaunching

src/store/actions/login.js

@@ -3,6 +3,7 @@ import {
 } from '../types/login'
 
 export function changeStack() {
+  console.log('--------')
   return {
     type: CHNAGE_STACK
   }

src/store/reducers/login.js

@@ -9,6 +9,7 @@ const initialState = {
 export default function reducer(state = initialState, action) {
     switch (action.type) {
         case CHNAGE_STACK:
+            console.log('--------state', state.isLaunching)
             return {
                 ...state,
                 isLaunching: !state.isLaunching

src/styles/index.js

@@ -32,6 +32,9 @@ const styles = StyleSheet.create({
         resizeMode: 'cover'
     },
     buttonContainer: {
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
         width: 60,
         height: 30,
         borderRadius: 15,
@@ -143,6 +146,12 @@ const styles = StyleSheet.create({
         backgroundColor: '#6699ff',
         marginTop: 10,
         width: 130
+    },
+    logoutButton: {
+        backgroundColor: '#6699ff',
+        width: 150,
+        height: 40,
+        borderRadius: 20
     }
 })