小编srd*_*kic的帖子

我有以下使用Formik在React中编写的表格：

import React, { FunctionComponent } from 'react';
import { NavLink } from 'react-router-dom';
import { object, string } from 'yup';
import { Formik, FormikActions, Field, FormikProps } from 'formik';
import SimpleInput from './Fields/SimpleInput';
import FieldError from './Fields/FieldError';

interface FormValues {
  email: string;
  password: string;
}
interface OwnProps {
  onSubmit: (data: FormValues) => any;
}

const validationSchema = object().shape({
  email: string()
    .email('Please enter a valid email address')
    .required('Email is a required field'),
  password: string()
    .min(8)
    .required('Password is a required field'), …

我的页面上有很多按钮，并且希望每个按钮在单击时都可以打开自己的模式形式。我有一个问题，即多次使用相同的表单/模式不会产生唯一的表单。例如，单击第一个按钮，然后在表单中键入“ asdf”也将填充由第二个按钮控制的表单。

我如何重用我的模态/表单并仍然保持它们的数据不同？

我的代码：

import React from 'react';
import ReactDOM from 'react-dom';
import 'antd/dist/antd.css';
import './index.css';
import { Button, Modal, Form, Input, Radio } from 'antd';
const FormItem = Form.Item;

const CollectionCreateForm = Form.create()(
  (props) => {
    const { visible, onCancel, onCreate, form } = props;
    const { getFieldDecorator } = form;
    return (
      <Modal
        visible={visible}
        title="Create a new collection"
        okText="Create"
        onCancel={onCancel}
        onOk={onCreate}
      >
        <Form layout="vertical">
          <FormItem label="Title">
            {getFieldDecorator('title', {
              rules: [{ required: true, message: 'Please input the title of …