Je fait un projet sur react native
Je ne sait pas si j'ai bien compris mais j'ai prévue d'utiliser redux pour transférer l'idantifiant de l'utilisateur vers une autre page après s'être authentifier.
Lorsque j'utilise la fonction dispatch je retrouve les donné grâce au console log mais jet n'arrive pas a les récupérer sur la prochaine page voici mon code:

LoginScreen.js
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
 
class LoginScreen extends Component {
    state = {
        UserLogin: '',
        UserPassword: '',
    };
 
    static navigationOptions = {
    header: null,
    };
 
    //gestion du boutton login
    loginButtonHandler = () => {
        if((this.state.UserLogin === '') || (this.state.UserPassword === '')){
            Alert.alert('Entrer un pseudo et un mot de passe')
        }else{
            //envoi du mdp et du login au serveur
            fetch(
                'http://192.168.1.109/gsbrapports/connection/traitement/traiterconnexion.php',
                {
                    method:'POST',
                    headers:{
                        'Accept': 'application/json',
                        'Content-Type': 'application/json'
                    },
                    body:JSON.stringify({
                    login: this.state.UserLogin,
                    mdp: this.state.UserPassword
                    })
                }
            )
            .then((response) => response.json())
            .then((responseJson) => {
                if(responseJson ==='fail'){
                    // si Pseudo ou mot de passe erroné
                    Alert.alert('Pseudo ou mot de passe erroné');
                }else{
                    // si succes go to home et envoi de la reponce
                    this.props.onLogin(responseJson);
                    this.props.navigation.navigate("Home");
 
 
                }
 
            })
            .catch((error) => {
                console.error(error);
            })
        }
 
    };
  render() {
    return (
        <KeyboardAvoidingView behavior="padding" style={styles.container}>
            <View style={styles.loginContainer}>
                <Image resizeMode="contain" style={styles.logo} source={require('../../../assets/images/logoGSB.png')} />
            </View>
 
            <View style={styles.formContainer}>
                <TextInput style = {styles.input} 
                            autoCapitalize="none" 
                            onChangeText={UserLogin => this.setState({UserLogin})} 
                            autoCorrect={false} 
                            keyboardType='default' 
                            returnKeyType="next" 
                            placeholder='Pseudo' 
                            placeholderTextColor='rgba(225,225,225,0.7)'/>
 
                <TextInput style = {styles.input}   
                            returnKeyType="go" 
                            onChangeText={UserPassword => this.setState({UserPassword})}
                            placeholder='Password' 
                            placeholderTextColor='rgba(225,225,225,0.7)' 
                            secureTextEntry/>
 
                <TouchableOpacity style={styles.buttonContainer} onPress={this.loginButtonHandler}>
                        <Text  style={styles.buttonText}>LOGIN</Text>
                </TouchableOpacity> 
            </View>
       </KeyboardAvoidingView>
    )
  }
}
 
 
const mapDispatchToProps = (dispatch) => ({
    onLogin: (user) => {
      dispatch(SingnIn(user));
    },
  });
export default connect(null, mapDispatchToProps)(LoginScreen);
authReducer.js

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
const AuthReducer = (state = initialState, action) => {
    switch (action.type) {
        case 'SIGN_IN':
            console.log(action.payload);
 
            return { ...state,
                user: action.payload
             };
        case 'GET_USER':
            return action.payload;
        case 'SIGN_OUT':
            return {...state, isSignedIn: false};
        default:
            return state;
    }
  };
 
  export default AuthReducer;
secondScreen,js
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
export class Try extends Component {
 
  render() {
    return (
      <View>
         {console.log(this.props.userId) }
      </View>
    )
  }
}
 
const mapStateToProps = state =>  {
  return {
      userId: state.auth
  };
};
 
 
export default connect(mapStateToProps)(Try)