Javascript 如何将简单的Formik表单与Redux存储连接并发送操作？

我是react/redux新手，但可以为我的应用程序实现一些简单的addProduct表单。 今天我试着用from替换它，但我不明白应该把“dispatch”函数放在哪里（我在任何地方都试过）

可能是我用错了连接方式吗

我的新组件与中完全相同，只是我用productName（和其他附加字段）替换了电子邮件。但我不明白如何将“值”从Formik传递到Redux存储

我的旧表单组件（不含Formik）如下所示：

从“React”导入React；
从'react redux'导入{connect}；
从“../actions”导入{addProduct}；
const AddProduct0=（{dispatch}）=>{
让输入的数字；
让inputProductName；
返回(
{
inputSKUNumber=节点；
}}
占位符=“SKU编号”
/>
{
inputProductName=节点；
}}
占位符=“产品名称”
/>
{
分派（addProduct（{SKUNumber:inputSKUNumber.value，名称：inputProductName.value}））；
inputSKUNumber.value=''；
inputProductName.value=''；
}}
>
添加产品
);
};
const AddProduct=connect（）（AddProduct0）；
出口默认产品
从“React”导入React；
从'react redux'导入{connect}；
从“../actions”导入{addProduct}；
/*添加产品、产品、产品、，
ему не нужен стор, поэтому мы можем создать коннект коротким путем:
AddProduct=connect（）（AddProduct）*/
const AddProduct=（{addMyProduct}）=>{
让输入的数字；
让inputProductName；
返回(
{
inputSKUNumber=节点；
}}
占位符=“SKU编号”
/>
{
inputProductName=节点；
}}
占位符=“产品名称”
/>
{
addMyProduct（{SKUNumber:inputSKUNumber.value，名称：inputProductName.value}）；
inputSKUNumber.value=''；
inputProductName.value=''；
}}
>
添加产品
);
};
const mapDispatchToProps=调度=>({
addMyProduct：（参数）=>调度（addProduct（参数））
});
导出默认连接（空，mapDispatchToProps）（AddProduct）我还在formik页面上打开了一个问题。其中一位撰稿人给了我答案。所有操作都使用该代码：


handleSubmit（值，{props，setSubmitting}）{
道具派送（添加产品（价值））；
设置提交（假）；
}，
您可以使用更高的变量或异步函数。高一点的变量有点蹩脚，但可以工作

let setSubmittingHigher;
// Our inner form component. Will be wrapped with Formik({..})
const MyInnerForm = (props) => {enter code here

.
.
.

    handleSubmit(values, {props, setSubmitting}) {
        setSubmittingHigher = setSubmitting;

.
.
.

const mapStateToProps = (state) => {
    typeof setSubmittingHigher === 'function' && setSubmittingHigher(false);
    return {}
};

const mapDispatchToProps = dispatch => ({
    addMyProduct: (params) => dispatch(addProduct(params))
});

export default connect(mapStateToProps, mapDispatchToProps)(AddProduct);

Dispatch是由redux控制的方法，connect函数的第二个参数是将动作映射到组件道具的方法，该函数通过Dispatch传递。下面是一个示例代码说明，我将导出和连接行合并到一个语句中，将功能组件重命名为AddProduct。似乎您添加0是为了简洁，而不是试图为其想出另一个名称。但是，根据组件中的代码，这不是必需的。如果这有帮助，请将答案标记为正确。：）PS:Formik不能添加为标记，因为最多有五个标记。Joshua，这部分代码是如何工作的。关于问题：我不明白如何使用Formik插件来改进它。很抱歉我误解了问题Joshua，对不起，是我，没有解释清楚：（现在我添加了新版本的组件。我希望它更容易理解，我说的是什么。也许你知道答案，或者你可以试试这种方法@ShamseerAhammed现在最好使用hook:
import{useDispatch}from'react redux'
（然后，在组件：）
const dispatch=useDispatch（）
或检查您的redux应用商店是否以正确的方式连接到应用程序。还要检查mapDispatchToProps，然后连接（…）