reactjs Form和onFinish未被触发

toe95027 于 2023-01-30 发布在 React

关注(0)|答案(2)|浏览(554)

我有一个onFinish函数，用于修改发送到后端API的值/json。
这是它的外观..

const onFinish = formProps.onFinish!;

    formProps.onFinish = (values: any) => {
        // Ignore display only fields.
        

        ["a", "b"].forEach((k: string) => {
            delete values[k];
        });

        onFinish(values);
    };
    .
    .
    .
    .
    <Form {...formProps} layout="vertical" onFinish={onFinish}>

这在我使用npm run dev的localhost中运行得非常好，但是在我运行npm ci然后运行npm run build的开发环境中不起作用
控制台日志确认onFinish仅在localhost中调用，而不在dev中调用。
有趣的是，控制台日志在其工作的环境中（下面首先显示）看起来有点不同

在此操作不起作用的环境中-我看到不同格式的日志（如下所示）

reactjs

来源：https://stackoverflow.com/questions/75171876/form-antd-onfinish-not-getting-triggered

2条答案

按热度按时间

jm81lzqq1#

我正在开发和生产服务器上使用antD onFinish，它对我来说完全正常。我不知道在你的情况下什么是formProps，但这是我如何使用antD表单。

const handleFinish = (values) => {
// You can do any kind of manipulation here
     console.log(values) // here it will work totally fine
}
<Form onFinish={handleFinish}>
// your form items
   <Button htmlType="submit">Submit</Button>
</Form>

我附上了https://codesandbox.io/s/bps4ef?file=/demo.tsx:150-158表单的codesandbox示例

赞(0）回复(0）举报 2023-01-30

5rgfhyps2#

这原来是一个minifier的问题。在将函数名从onFinish改为handleFinish后-它开始工作了。

赞(0）回复(0）举报 2023-01-30