Formik Typescript - 'FC<IProps>' 类型的参数不可分配给 'CompositeComponent<object & FormikSharedConfig<{}> 类型的参数

Question

我正在尝试使用“withFormik”HOC 将 formik 添加到我的 React Hooks 组件，但出现错误

Argument of type 'FC' is not assignable to parameter of type 'CompositeComponent<object & FormikSharedConfig<{}> & FormikState & FormikHelpers & FormikHandlers & FormikComputedProps<...> & FormikRegistration & { ...; }>'. Type 'FunctionComponent' is not assignable to type 'StatelessComponent<object & FormikSharedConfig<{}> & FormikState & FormikHelpers & FormikHandlers & FormikComputedProps<...> & FormikRegistration & { ...; }>'.

下面是我的相同代码

import React from "react";

//Libraries import........
import { Form, Input, Button, Checkbox } from "antd";
import { FormikProps, FormikValues, useFormik, withFormik } from "formik";
import styles from "./login.module.scss";
import * as Yup from "yup";
//Components import........

interface FormValues {
  email: string;
}

interface IProps extends FormikProps<FormValues> {}

const Login: React.FC<IProps> = (props) => {
  const { handleSubmit, handleBlur, handleChange, handleReset } = props;

  return (
    <Form
      name="basic"
      labelCol={{ span: 8 }}
      wrapperCol={{ span: 16 }}
      onSubmitCapture={handleSubmit}
      autoComplete="off"
    >
      <Form.Item label="Username" name="email">
        <Input />
      </Form.Item>

      <Form.Item label="Password" name="password">
        <Input.Password />
      </Form.Item>

      <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
        <Button type="primary" htmlType="submit">
          Submit
        </Button>
      </Form.Item>
    </Form>
  );
};

export const LoginView = withFormik({
  mapPropsToValues: (props) => ({ email: "", password: "" }),
  validationSchema: Yup.object({
    email: Yup.string().required(),
  }),
  handleSubmit: (values) => {
    console.log(values);
  },
})(Login);

所以我的（“登录”）悬停时出现此错误

另外，我的代码运行没问题，但我的 VS Code 中确实出现了这个错误。

感谢任何帮助谢谢:)

Answer 1

尝试将描述 props 添加到您的 withFormik<MyFormProps, FormValues>(){...}

interface FormProps {
    email: string;
    password: string;
}

interface FormValues {
    email: string;
}

export const LoginView = withFormik<FormProps, FormValues>(){...}

ps。从文档示例 https://formik.org/docs/guides/typescript#withformik

中得到答案

Formik Typescript - 'FC<IProps>' 类型的参数不可分配给 'CompositeComponent<object & FormikSharedConfig<{}> 类型的参数

Formik Typescript - Argument of type 'FC<IProps>' is not assignable to parameter of type 'CompositeComponent<object & FormikSharedConfig<{}>

typescript

reactjs

formik

react-typescript