私のプロジェクトでは、redux-thunkによる非同期検証

Question

私はRedux-Formを使用しています。

パスワードを検証し、パスワードが正しい場合は自動的にユーザーをシステムにログします。ユーザーがログに記録された後、いくつかの内部還元状態が更新されます。これを行うには、私はリムックスサンクをアクションメソッドで使用しました。

私が直面している問題は、redux thunkアクションが非同期redux-form検証に必要なPromiseを返さないということです。

これは私が持っているエラーです：

asyncValidate function passed to reduxForm must return a promise 

は、問題がある場合、誰かが知っていますか？

ここで私が使用していたコードです：

asyncValidate.js

import {logIn} from '../user/actions'; 

const asyncValidate = (values, dispatch) => { 
    return logIn(values.booker.email, values.booker.password); 


} 

export default asyncValidate 

ユーザのログインアクション

export const logIn = (email, password) => (dispatch) => 
new Promise(function (resolve, reject) { 
    axios.post('/login_check', qs.stringify({ 
     _username: email, 
     _password: password, 
     _csrf_token: CSRF_TOKEN 
    }), ajaxConfig) 
     .then(response => { 
      if (response.data.success !== true) { 

       dispatch({ 
        type: LOG_IN_ERROR, 
        payload: response.data.message 
       }); 
       reject(response.data.message); 

      } 
      else { 
       dispatch({ 
        type: LOG_IN_SUCCESS, 
        payload: response.data.user 
       }); 
       resolve(); 
      } 

     }) 
     .catch((error) => { 
      dispatch({ 
       type: LOG_IN_ERROR, 
       payload: error 
      }); 
      reject(error); 
     }) 

}); 

EDIT 1：

は、

@Ravindra Ranwalaが示唆した試行コード：

@Emrys Myrooinは、コードをアクションからasyncValidation関数に移動するよう提案しましたが、ユーザー（この場合は私）がエラーをトリガーしません。間違ったパスワードを入力します。ここで

新しいasyncValidate関数のコードです：

：できるだけ早くパスワードフィールドは、私はこのエラーを得たぼかしイベントをトリガーとして、このコードのコメント

から

import {LOG_IN_ERROR, LOG_IN_SUCCESS, CSRF_TOKEN} from '../booker/actions'; 
    import axios from 'axios'; 
    const qs = require('qs'); 
    const ajaxConfig = { 
     headers: {"X-Requested-With": "XMLHttpRequest"} 
    }; 

const asyncValidate = (values, dispatch) => { 
    console.log(values); 
    return new Promise(function (resolve, reject) { 
     axios.post('/login_check', qs.stringify({ 
     _username: values.booker.email, 
     _password: values.booker.password, 
     _csrf_token: CSRF_TOKEN 
    }), ajaxConfig) 
     .then(response => { 
      console.log(response); 
      if (response.data.success !== true) { 

       dispatch({ 
        type: LOG_IN_ERROR, 
        payload: response.data.message 
       }); 
       reject(response.data.message); 

      } 
      else { 
       dispatch({ 
        type: LOG_IN_SUCCESS, 
        payload: response.data.user 
       }); 
       resolve(); 
      } 

     }) 
     .catch((error) => { 
      dispatch({ 
       type: LOG_IN_ERROR, 
       payload: error 
      }); 
      reject(error); 
     }) 
    }) 


    } 

    export default asyncValidate 

EDIT 2.更新されたコード、

Uncaught Error: asyncValidate function passed to reduxForm must return a promise 

Ajaxリクエストが完了した後、私は最初から持っていると思っている検証エラーメッセージを受け取りましたが、

asyncValidate.js?9b4c:19 Uncaught (in promise) Error: Bad credentials. 

asyncValidate機能：

import {logInError, logInSuccess, CSRF_TOKEN} from '../booker/actions'; 

import axios from 'axios' 
const qs = require('qs') 
const ajaxConfig = { 
    headers: { 'X-Requested-With': 'XMLHttpRequest' }, 
} 

const asyncValidate = (values, dispatch) => { 
    axios 
     .post(
      '/login_check', qs.stringify({ 
       _username: values.booker.email, 
       _password: values.booker.password, 
       _csrf_token: CSRF_TOKEN, 
      }), ajaxConfig) 
     .then(response => { 
      console.log(response); 
      if (response.data.success) 
       dispatch(logInSuccess(response.data.user)) 
      else 
       throw new Error(response.data.message) 
     }) 
     .catch(error => { 
      dispatch(logInError(error.message)) 
      throw error 
     }) 
} 

export default asyncValidate 

減速アクション：

export const logInSuccess = response => ({ 
    type: LOG_IN_SUCCESS, 
    payload: response 

}); 

export const logInError = (response) => ({ 
    type: LOG_IN_ERROR, 
    payload: response 


});