Uncaught TypeError: antd_es_form__WEBPACK_IMPORTED_MODULE_9__.default.create(...) is not a function

目录

• • 报错信息
  • 网上查到的解法一
  • 网上查到的解法二
  • 我最终的解法

报错信息

login.jsx:111 Uncaught TypeError: antd_es_form__WEBPACK_IMPORTED_MODULE_9__.default.create(...) is not a function
           

网上查到的解法一

• 原因：由于antd的版本导致
• 解决：package.json文件下的antd版本号修改为3.26.14

  

• 我的版本【“antd”: “^4.9.4”,】

网上查到的解法二

• Ant Design 4.0 对Form进行了修改，已经不使用 Form.create，也不需要使用了，它会自动验证，移除了原来的onSubmit，改用onFinish。
• 改完之后还是会存在这个问题！！！是因为在跟升级antd是使用了官网推荐的方法：npm i -g @ant-design/codemod-v4
• 改完之后还是会存在这个问题是因为

• 然后把这个From删除换成antd推荐语法

import { Form, Input, Button } from 'antd';

      <Form
          name="normal_login"
          className="login-form"
          initialValues={{ remember: true }}
          onFinish={this.handleSubmit}
        >
          <Form.Item
            name="username"
            rules={[{ required: true, message: 'Please input your Username!' }]}
          >
            <Input prefix={<UserOutlined className="site-form-item-icon" />} placeholder="Username" />
          </Form.Item>
          <Form.Item
            name="password"
            rules={[{ required: true, message: 'Please input your Password!' }]}
          >
            <Input
              prefix={<LockOutlined className="site-form-item-icon" />}
              type="password"
              placeholder="Password"
            />
          </Form.Item>
          <Form.Item>
            <Button type="primary" htmlType="submit" className="login-form-button">
               登录
            </Button>
          </Form.Item>
        </Form>

           

我最终的解法

yarn add @ant-design/compatible
           

• 把原来的import {Form} from ‘antd’; 改成 import { Form } from '@ant-design/compatible’