使用React Final Form进行Redux调度

Question

我正在努力理解为什么dispatch在我的操作中不可用，但没有用。这是我试过的。

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Field, Form } from 'react-final-form';
import { createProfile } from '../../actions/actions_members';
const onSubmit = async (values) => {
createProfile(values)
}
const Signup = () => (
<Form
onSubmit={onSubmit}
render={({ handleSubmit, submitting, pristine, values }) => (
<form onSubmit={handleSubmit} >
<label>Email:</label>
<Field type='text' className='input' component="input" type="text" name='email'/>
<label>Password:</label>
<Field className='input' component="input" type="password" name='password' />
{/*<label>Confirm password:</label>
<input type='password' className='input' name='password' {...password} />*/}
<button type="submit" disabled={submitting || pristine}>
Submit
</button>
</form>
)}
/>
)
export default connect()(Signup)

这是我的actions_members文件

import * as C from './actions_const.js'
import { post, get } from '../helpers/apiConnection.js'
const createProfile = (value, dispatch) => {
var data = {
ep: "EP_SIGNUP",
payload : {
email: value.email,
password: value.password
}
}
post(data).then((result)=>dispatch({type:C.MEMBER_CREATE}));
}
export { createProfile }

我不知道如何将dispatch传递给我的createProfile动作

Answer 1

您只需要从onSubmit函数传入即可。

const dispatch = useDispatch();
const onSubmit = async (values) => {
createProfile(values, dispatch)
}

另一种选择是在action_members文件中导入存储，并使用store.dispatch，这相当于相同的东西。

import * as C from './actions_const.js'
import { post, get } from '../helpers/apiConnection.js'
import store from '../whereverReduxStoreIsSetup.js';
const createProfile = (value) => {
var data = {
ep: "EP_SIGNUP",
payload : {
email: value.email,
password: value.password
}
}
post(data).then((result)=>store.dispatch({type:C.MEMBER_CREATE}));
}
export { createProfile }