javascript - 属性 'submitAction' 在类型 '{}' 中缺失,但在类型中需要

标签 javascript reactjs typescript redux redux-form

我正在尝试学习 redux 表单和 typescript ,但遇到了一个我无法解决的错误。

错误是:Property 'submitAction' is missing in type '{}' but required in type 'Readonly<IDispatchProps & Partial<ConfigProps<IUser, IDispatchProps, string>>>'.ts(2741)
这是我认为错误的地方......

//表格.tsx

import * as React from 'react';
import { Input } from "../FormInput/FormInput";
import { Button } from "../FormButton/FormButton"
import { Validation } from "./FormValidation"
import { reduxForm, InjectedFormProps, Field } from 'redux-form';
import './formStyles.scss';

export interface IUser {
  title: string;
  description: string;
}

export interface IDispatchProps {
  submitAction:() => any;
}

const Form = (props:IDispatchProps & InjectedFormProps<IUser, IDispatchProps>) => (
    <div className="LoginFormWrapper">
      <div className="bodyWrapper">
        <Field
          id="title"
          name="title"
          placeholder="Enter title"
          type="text"
          component={Input}
        />
        <Field
          id="description"
          name="description"
          placeholder="Enter description"
          type="text"
          component={Input}
        />
        <div className="buttonWrapper">
          <Button
            text="Submit"
            onClick={() => props.submitAction()}
            isDisabled={props.invalid}
          />
        </div>
      </div>
    </div>
);

export const FormEx = reduxForm<IUser, IDispatchProps>({
  form: 'Form',
  validate: Validation,
})(Form);

错误显示在 <FormEx />
import React from 'react';
import { connect } from 'react-redux';
import { createStream } from '../../actions';
import './formStyles.scss';
import { FormEx } from './Form/From';

interface StreamCreate {
  createStream: any;
}

class StreamCreate extends React.Component<StreamCreate>  {
  render() {
    return (
      <div>
        <h3>Create</h3>
        <FormEx />
      </div>
    )
  }
}

export default connect(null, { createStream })(StreamCreate);

谢谢

最佳答案

您的 Form组件有一个必需的 submitAction支柱。 (如您的 IDispatchProps 界面中所定义。)

传递类型为 () => any 的任何函数给您的 <FormEx />组件,错误应该消失。

例如:

<FormEx submitAction={console.log("submit")} />

关于javascript - 属性 'submitAction' 在类型 '{}' 中缺失,但在类型中需要,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61384161/

相关文章:

Javascript - 不重复代码的随机报价生成器

javascript - 在后端加载内容时显示 Logo /广告

reactjs - 是否应该使用箭头函数创建类方法

javascript - Angular typescript如何将字符串转换为html对象并将其传递给变量

javascript - Angular2可点击表格行,最后一个单元格除外

node.js - 将枚举与 TypeScript 结合使用,并在每个枚举上使用方法

javascript - NestJS 设计响应结构

javascript - 从 CSV 文件返回值 (jQuery/Javascript)

javascript - javascript 中的 map 函数不能为 React 组件正常工作

javascript - react onclick 数据值返回 null