React Redux Как перейти к действию целевого значения полезной нагрузки

Question

Интересно, как передать действие полезной нагрузки моего входного значения?

В моем компоненте у меня есть адрес электронной почты, например.

<input type="email" value={this.state.email} onChange={this.handleChange}/>
 <input type="password" value={this.state.password} onChange={this.password}/>

У меня есть состояние в моем компоненте:

state = {
        email: '',
        password: ''
    };

, и я получаю значение с помощью метода onChange:

handleChange = (e) => {
        this.setState({email: e.target.value});
    }
 password = (e) => {
        this.setState({password: e.target.value})
    }

при отправке формы мне нужно запуститькакая-то функция, и здесь я отправляю свое действие

login = () => {
        this.props.userLogin() 
    }

в моем mapDispatchToProps, отправляя мое действие userLogin.но как я могу перейти к действию полезной нагрузки this.state.email и this.state.password для использования в моем действии для отправки API?

function mapDispatchToProps(dispatch) {
    return {
        userLogin: bindActionCreators(userLogin, dispatch),
    }
}

Answer 1

При отправке действия вы можете передать требуемые значения в качестве аргументов, например

login = () => {
    this.props.userLogin(this.state.email, this.state.password); 
}

и в методе useLogin в файле action.js вы можете прочитать эти аргументы как

const userLogin = (email, password) => {
   // your userLogin code here
}

Answer 2

Вы можете сделать что-то вроде этого:

function mapDispatchToProps(dispatch, props) {
    return {
        userLogin: bindActionCreators(props.loginInfo, dispatch),
    }
}

и вы можете назвать это так:

login = () => {
        this.props.userLogin(this.state);
        // state will habe password and username as {username, password}
    }

Answer 3

Я решил проблему, все работает хорошо с моим первым подходом. Здесь проблема была установка состояния в компоненте с конструктором. Когда я удаляю конструктор, все работало.

Answer 4

Вы можете передать объект состояния в создатель действия и получить в создателе действия, как в аргументе, где вы получили.