Redux Form v6 - функция onSubmit, вызывающая, но не отправляющая действие

Question

Я пытаюсь настроить простую форму с использованием редукционной формы. Прямо сейчас у меня есть кнопка, которая должна отправить действие. Я вижу действие SET_SUBMIT_SUCCEEDED, поэтому я знаю, что форма отправлена ​​успешно, и я вижу, что функция onSubmit, которую я указал, вызывается, но она не отправляет действие.

// root reducer 
import { combineReducers } from 'redux' 
import { reducer as reduxFormReducer } from 'redux-form' 
import login from './login' 

export default combineReducers({ 
    login, 
    form: reduxFormReducer 
}) 


// action-creator 
import { createAction } from './create_action' 
import { postJson } from './fetch' 
import { 
    LOGIN_ERROR, 
    LOGIN_REQUEST, 
    LOGIN_SUCCESS 
} from '../constants/constants' 

const login =() => { 
    return function (dispatch) { 
    dispatch(createAction(LOGIN_REQUEST)) 
    return postJson('/login') 
     .then(res => res.json()) 
     .then(data => 
     dispatch(createAction(LOGIN_SUCCESS, { data })) 
    ) 
     .catch(error => dispatch(createAction(LOGIN_ERROR, { error }))) 
    } 
} 


//component 
import React from 'react' 
import { reduxForm } from 'redux-form' 
import login from '../redux/submit-handlers/login' 

const Login = (props) => { 
    const { handleSubmit } = props 
    return (
    <form onSubmit={handleSubmit}> 
     <h3>Login</h3> 
     <button>Login</button> 
    </form> 
) 
} 

export default reduxForm({ 
    form: 'login', 
    onSubmit: login 
})(Login) 



//create_action 
export const createAction = (type, payload) => { 
    return { 
    type, 
    payload 
    } 
} 

У меня не было проблем с отправкой действий с использованием этого подхода в других компонентах. У меня должно быть что-то неправильно с редуксом, но я чувствую, что делаю это так, как описано в примерах.

Если я прохожу функцию входа вниз в реквизите и передать его в handleSubmit как этот

<form onSubmit={handleSubmit(() => {login()})}> 

onSubmit функция вызывается, но она вызывается перед SET_SUBMIT_SUCCEEDED который заставляет меня думать, что любая проверка я добавляю бы не работать, и он все равно подчинится.

Answer 1

Кажется, что ваша функция login должна иметь другую подпись.

От глядя на документы http://redux-form.com/6.2.0/docs/api/ReduxForm.md/

onSubmit будет вызываться со следующими параметрами:

значений: Object Значения полей в виде {field1: 'value1', Field2: 'value2'}.

Отправка: Function Функция отправки Redux.

реквизиты: Объект Реквизит перешел в ваш украшенный компонент.

Try что-то вроде:

const login = ({dispatch}) => { 
    dispatch(createAction(LOGIN_REQUEST)) 
    return postJson('/login') 
    .then(res => res.json()) 
    .then(data => 
     dispatch(createAction(LOGIN_SUCCESS, { data })) 
    ) 
    .catch(error => dispatch(createAction(LOGIN_ERROR, { error }))) 
    } 
} 

Answer 2

Это работало

const login = (values, dispatch) => { 
    dispatch(createAction(LOGIN_REQUEST)) 
    return postJson('/login') 
    .then(res => res.json()) 
    .then(data => 
     dispatch(createAction(LOGIN_SUCCESS, { data })) 
    ) 
    .catch(error => dispatch(createAction(LOGIN_ERROR, { error }))) 
}