Execute function managed by Redux

Question

Execute function managed by Redux

Navigation

#1 by (1 votes)

0

My app React Native is managed by Redux . I need to run the _verificaLogin() function automatically by connect when my app is rendering. The way I did it is not working, I think props has not received the function yet when I call the componentDidMount .

follow the code:

class Login extends React.Component {

constructor(props) {
    super(props);
    this.state = {
        email: '',
        senha: ''
    };
}

componentDidMount() {
    this._verificaLogin();
}

_verificaLogin() {
    const { email, senha } = this.state;
    this.props.verificaLogin();
}

render() {
    return (
        <View style={ styles.container }>
            <StatusBar backgroundColor={ '#303F9F' } />

            <TextInput style={ styles.input } placeholder={ "Email" }
                       value={ this.state.email }
                       onChangeText={ email => this.setState({ email }) }/>

            <TextInput style={ styles.input } placeholder={ "Senha" }
                       value={ this.state.senha }
                       onChangeText={ senha => this.setState({ senha })}/>

            <Text style={{ color: 'red', height:45 }}>{ this.props.message }</Text>

            <View style={{ marginTop: 24 }}>
                <View style={ styles.bt }>
                    <Button style={ styles.input } title={ "ENTRAR" } color={ '#3f51b5' }
                            onPress={ () => this._verificaLogin() }/>
                </View>

                <View style={ styles.bt }>
                    <Button style={ styles.input } title={ "ATIVAR CONTA" } color={ '#747474' }
                            onPress={ () => Actions.ativar() }/>
                </View>

                <TouchableHighlight style={{ marginTop: 16, alignItems: 'center' }} onPress={ () => false }>
                    <Text style={{ color: '#e5625d' }}>Esqueci minha senha</Text>
                </TouchableHighlight>
            </View>
        </View>
    );
}
}

const mapStateToProps = state => ({
    message: state.LoginReducer.message
});

export default connect(mapStateToProps, { verificaLogin })(Login);

react-native redux

asked by anonymous 13.02.2018 / 19:26

1 answer

How to use Rewrite to include sub-directory and slug? Field as parameter in Generic Update - ORACLE

score 1 · Answer 1

You need to make a dispatch to add your function in connect. Ex:

import actions from 'myActions'

...

const mapStateToProps = state => ({
    message: state.LoginReducer.message 
});

const mapDispatchToProps = dispatch => ({
    verificaLogin: () => dispatch(actions.verificaLogin())
});
export default connect(mapStateToProps, mapDispatchToProps)(Login);