reactjs - React-final-form 如何在表单的渲染中处理提交

Question

似乎我无法掌握React-final-form 的工作原理。

有一个具有以下部分的功能组件： 在顶部：

import {Form, Field} from "react-final-form";

然后在返回中：

return (
    <Fragment>
        <Form
            onSubmit={handleSubmit}
            render={ ({innerSubmit, form, submitting, pristine, values}) => (
                <form onSubmit={innerSubmit}>
                   ( Bunch of Fields... )

                     <div className="buttons">
                        <button type="submit" disabled={submitting}>
                            Save
                        </button>
                        <button
                            type="button"
                            onClick={form.reset}
                            disabled={submitting || pristine}>
                            Reset
                        </button>
                    </div>
                </form>
            )}
        />
   </Fragment>
)

因此，渲染是一个传递对象的函数。在那个对象中，第一个是“innerSubmit”。

innerSubmit 是如何连接到“handleSubmit”的？

对象中的这些值是什么（innerSubmit、form、submitting、pristine 和 values）。React.dom 中的 render 函数（render 来自哪里）有不同的参数。

Answer 1

请仔细检查文档。似乎handleSumbit 是一种作者的命名约定，应该用作渲染中的道具。另一方面，你的'innerSumbit'（我想它是一个表单处理函数？）应该传递给Form中的'onSumbit'。

对您来说，查看 react-final-form author's yt tutorial可能是一个好主意。